无法使用jQuery函数触发.ajaxComplete()函数

时间:2015-05-29 08:21:15

标签: php jquery ajax

我目前正在尝试使用ajax函数来检查名称可用性,但我无法提示正确的消息。它始终停留在" loading"那里的图标。我曾尝试对代码进行故障排除,似乎无法触发.ajaxComplete功能。我对此一无所知,请指出我做错了什么。感谢

这是我的Ajax代码:

<script type="text/javascript">

        pic1 = new Image(16, 16); 
        pic1.src = "assets/img/loader.gif";

        $(document).ready(function(){

        $("#packageName").change(function() { 

        var pName = $("#packageName").val();

        if(pName.length >= 4)
        {
        $("#status").html('<img src="assets/img/loader.gif" align="absmiddle">&nbsp;Checking availability...'); 
            $.ajax({  
            type: "POST",  
            url: "checkPackageAvaibility.php",  
            data: "packageName="+pName,

            success: function(msg){  

           $("#status").ajaxComplete(function(event, request, settings){
            if(msg == "OK")
            { 
                $("#packageName").removeClass('object_error'); // if necessary
                $("#packageName").addClass("object_ok");
                $(this).html('&nbsp;<img src="assets/img/tick.gif" align="absmiddle">');
            }  
            else  
            {  
                $("#packageName").removeClass('object_ok'); // if necessary
                $("#packageName").addClass("object_error");
                $(this).html(msg);
            }  

           });

         } 

          }); 

        }
        else
            {
            $("#status").html('<font color="red">The username should have at least <strong>4</strong> characters.</font>');
            $("#packageName").removeClass('object_ok'); // if necessary
            $("#packageName").addClass("object_error");
            }

        });

        });

        //-->
        </script>

这是我的php代码:

<?php
     include "include/session.php";
     include 'include/dbConnect.php';

     global $dbLink;

     if(isset($_POST["packageName"])){

         $pacName = $_POST["packageName"];

         $query= ("SELECT * FROM Package WHERE package_name = '$pacName'");
         $sql_check = sqlsrv_query($dbLink,$query);

         $rows = sqlsrv_has_rows($sql_check);

         if($rows ===true )
        {
        echo '<font color="red">The nickname <STRONG>'.$pacName.'</STRONG> is already in use.</font>';
        }
        else
        {
        echo 'OK';
        }
     }

?>

2 个答案:

答案 0 :(得分:2)

您需要将ajaxComplete绑定到文档

  

从jQuery 1.8开始,只应附加.ajaxComplete()方法   记录。

所以

$(document).ajaxComplete(function(event, request, settings){
})

演示:Fiddle

您不需要ajaxComplete(),而只需使用完成回调,例如

pic1 = new Image(16, 16);
pic1.src = "assets/img/loader.gif";

$(document).ready(function () {

    $("#packageName").change(function () {
        var pName = $("#packageName").val();
        if (pName.length >= 4) {
            $("#status").html('<img src="assets/img/loader.gif" align="absmiddle">&nbsp;Checking availability...');
            $.ajax({
                type: "POST",
                url: "checkPackageAvaibility.php",
                data: "packageName=" + pName
            }).done(function (msg) {
                if (msg == "OK") {
                    $("#packageName").removeClass('object_error'); // if necessary
                    $("#packageName").addClass("object_ok");
                    $('#status').html('&nbsp;<img src="assets/img/tick.gif" align="absmiddle">');
                } else {
                    $("#packageName").removeClass('object_ok'); // if necessary
                    $("#packageName").addClass("object_error");
                    $('#status').html(msg);
                }
            });
        } else {
            $("#status").html('<font color="red">The username should have at least <strong>4</strong> characters.</font>');
            $("#packageName").removeClass('object_ok'); // if necessary
            $("#packageName").addClass("object_error");
        }

    });

});

答案 1 :(得分:1)

您在ajax请求完成时触发的函数中附加了一个ajaxComplete事件处理程序。

除了你不能这样做之外,你也不需要,在这种情况下你只需success函数:

success: function(msg) {  
    if(msg == "OK") { 
        $("#packageName").removeClass('object_error'); // if necessary
        $("#packageName").addClass("object_ok");
        $("#status").html('&nbsp;<img src="assets/img/tick.gif" align="absmiddle">');
    } else {  
        $("#packageName").removeClass('object_ok'); // if necessary
        $("#packageName").addClass("object_error");
        $("#status").html(msg);
    }
}