在 Ajax 查询的输入字段中更正 Javascript 的事件侦听器

Question

我想要发生的是，在选择成员后，将自动输入省、镇和描笼涯，但我想为该省添加另一个侦听器以再次查询运输方式，但我的代码是不在

工作

$("#member_id").change(function () {
    var value=$(this).val();
    $.ajax({
        type : 'get',
        url : '/panel/admin/members/search_id',
        data:{'search':value},
        success:function(data){
            //console.log(data);
            $("#loading_member").css("display", "block");
            setTimeout(function(){
                $("#loading_member").css("display", "none");
                $('#province').val(data.province);
                $('#city_town').val(data.city_num);
                $('#brgy').val(data.brgy);
                $('#member_code').val(data.member_code);
            },500);
        } 
    });
});

这部分不工作，我不知道确切的用途。

const provincelist = document.querySelector('#province');

provincelist.addEventListener('provincelist', updateValue);

function updateValue() {
    var value=$('#province').val();
    $.ajax({
        type : 'get',
        url : '{{route("panel.admin.search_province")}}',
        data:{'search':value},
        success:function(data){
            $("#loading_shipping").css("display", "block");
            setTimeout(function(){
                $("#loading_shipping").css("display", "none");
                $('#shipping_method').find('option').remove().end();
                $('#shipping_method').append(data);
            },500);
        } 
    });
    console.log(value);
}

这是正确的做法吗？我只想在每次 $('#province').val(data.province) 有值时再执行一次 ajax 查询。有人可以帮助我吗？

Answer 1

我建议：

provincelist.addEventListener('change', updateValue);

第一个参数是事件名称，第二个参数是事件发生时执行的回调。 'provincelist' 不是已知事件。参见 eventListener。

现在，事件从用户操作中触发。如果 #province 的值像第一个 Ajax 成功回调那样以编程方式更改，则不会有 change 事件。但是您可以在值更改后立即调用 updateValue() 函数。

success:function(data){
   //console.log(data);
   $("#loading_member").css("display", "block");
   setTimeout(function(){
   $("#loading_member").css("display", "none");
   $('#province').val(data.province);
   $('#city_town').val(data.city_num);
   $('#brgy').val(data.brgy);
   $('#member_code').val(data.member_code);
   updateValue();  // <-------------- Call the second Ajax here
 },500);

}

在 Ajax 查询的输入字段中更正 Javascript 的事件侦听器

Correct event listener for Javascript in input field for Ajax Query

javascript

ajax

jquery

event-handling

jquery-events