jQuery onChange只运行一次

Question

我在Wordpress Woo表单中有jQuery函数，它基本上是基于下拉列表填充某些字段的，但是jQuery只执行一次。代码：

jQuery(document).ready(function() {
// Your code in here
jQuery(document).on('change', '#billing_complex_name', function() {
myFunc();
})
function myFunc() {
// your function code
var complex_name = jQuery('#billing_complex_name').val();
var suburb = jQuery('#billing_suburb').val();
if (complex_name == 'eldogleneast') {
jQuery("#billing_suburb").val('ELD');
jQuery('#billing_postcode').val('0157');
} else if (complex_name == 'Reldoglen') {
jQuery("#billing_suburb").val('LPN');
jQuery('#billing_postcode').val('0133');
} else if (complex_name == 'eldin') {
jQuery("#billing_suburb").val('STK');
jQuery('#billing_postcode').val('2147');
jQuery("#billing_complex_address").val('Lion St');
} else if (complex_name == 'elm') {
jQuery("#billing_suburb").val('ELD');
jQuery('#billing_postcode').val('0147');
jQuery("#billing_complex_address").val('Lor Ave');
}
}
})

我如何让它总是在Change上运行，而不仅仅是一次。

Answer 1

如果第一次选择工作，第二次不需要像我的代码片段中那样在mouseenter事件上reset value of select。

不需要写入document ready statement对于static和dynamic都选择更改
类似的东西

jQuery(document(.on('change'，'select'，function(e({
//dosomething
}(；

我希望下面的片段能对你有所帮助。

function myFunc(getvalue) {
var complex_name = getvalue;
if (complex_name == 'eldogleneast') {
jQuery("#billing_suburb").val('ELD');
jQuery('#billing_postcode').val('0157');
} else if (complex_name == 'Reldoglen') {
jQuery("#billing_suburb").val('LPN');
jQuery('#billing_postcode').val('0133');
} else if (complex_name == 'eldin') {
jQuery("#billing_suburb").val('STK');
jQuery('#billing_postcode').val('2147');
jQuery("#billing_complex_address").val('Lion St');
} else if (complex_name == 'elm') {
jQuery("#billing_suburb").val('ELD');
jQuery('#billing_postcode').val('0147');
jQuery("#billing_complex_address").val('Lor Ave');
}
}
jQuery(document).on('change', '#billing_complex_name', function () {
var getname = jQuery('#billing_complex_name').val();
jQuery("#billing_suburb, #billing_postcode, #billing_complex_address").val('')// first reset
myFunc(getname);
});
jQuery(document).on('mouseenter', '#billing_complex_name', function () {
$(this).val(''); // need to reset after change 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="billing_complex_name">
<option value="" selected>---</option>
<option value="eldogleneast">eldogleneast</option>
<option value="Reldoglen">Reldoglen</option>
<option value="eldin">eldin</option>
<option value="elm">elm</option>
</select>
<br><br>
<label>Suburb</label><br>
<input type="text" id="billing_suburb">
<br><br>
<label>Post Code</label><br>
<input type="text" id="billing_postcode">
<br><br>
<label>Address</label><br>
<input type="text" id="billing_complex_address">