Question

嘿，我试图找出代码中的错误，我正在使用文本框检查输入的值是否在数据库中可用（通过onchange事件）如果值不可用则提供警报（“无效号码”）;

当我第一次打开它时代码工作正常，一旦我刷新它给我2次警报按摩。

这是我的代码：

$(document).ready(function(){
    $(document).on('change','#acccno', function () {
        var acno = $(this).val();
        var data={"acno":acno,"acccno":1};
        $.ajax({
            url:"accsav.php",
            async: false,
            type:"POST",
            data:data,
            success:function(dat){
                if(dat===''){
                    alert("Invalid  Number");
                    $("#acccno").val('');
                   // $("#acccno").focus();
                } else {
                    $("#image1").html(dat);
                }
            },
            error:function(er){
                console.log(er);
            }
        });
     });
});

Answer 1

当给定的帐号无效时，它会显示警告消息并更改输入为空字符串，这会再次触发事件并在这种情况下再次显示警报，因为服务器响应时带有空帐号可能也无效。然后它再次更改值，但因为它已经为空，然后此处没有任何更改，并且事件不再被触发。

我的建议：用表单包装字段并使用onsubmit事件代替。

Answer 2

您可以将事件绑定到特定元素，而不是整个文档，无论如何，或者您可以尝试使用＆＃34;输入＆＃34;事件

引用本网站：https://developer.mozilla.org/en-US/docs/Web/Events/change

针对<input>，<select>和<textarea>触发了更改事件元素的值更改时的元素用户。与输入事件不同，更改事件不一定每次更改元素值时都会触发。

Answer 3

这真的是一个需要做的简单改变。成功后，您将清空输入框中的值。这会触发另一个更改事件并再次调用ajax，但这次是空值。在更改功能内部，您可以检查值是否为空。请找到下面的固定版本

$(document).ready(function(){
$(document).on('focusout','#acccno', function () {
    var acno = $(this).val();
    var data={"acno":acno,"acccno":1};

if( acno !=''){
    $.ajax({
        url:"accsav.php",
        async: false,
        type:"POST",
        data:data,
        success:function(dat){
            if(dat===''){
                alert("Invalid  Number");
                $("#acccno").val('');
               // $("#acccno").focus();
            } else {
                $("#image1").html(dat);
            }
        },
        error:function(er){
            console.log(er);
        }
    });
}
 });
});

AJAX成功事件运行两次

3 个答案: