对于全局Ajax事件处理程序,不会触发警报或控制台

时间:2015-09-13 11:00:28

标签: jquery ajax

我正在尝试使用Global Ajax事件处理程序。

在我的代码中,.load方法有效,但我没有为各种事件阶段(开始/发送/成功/完成)获取任何alert或控制台消息。< / p>

可能是什么问题?

<body>
    <div class="result"></div>
    <input type="button" id="ajaxBtn" value="Send Ajax Request" />
</body>

<script src="Scripts/jquery-2.1.4.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#ajaxBtn").click(function () {
            $(".result").load("test.html");
        });

        $(".result").ajaxStart(function () {
            alert("hello");
            console.log('ajaxStart triggered');
        });

        $(".result").ajaxSend(function () {
            console.log('ajaxSend triggered');
        });

        $(".result").ajaxError(function () {
            console.log("ajaxError triggered.");
        });

        $(".result").ajaxComplete(function () {
            console.log('ajaxComplete triggered');
        });

        $(".result").ajaxStop(function () {
            console.log('ajaxStop triggered');
        });

        $(".result").ajaxSuccess(function () {
            alert("hello");
            console.log('ajaxSuccess triggered');
        });
    });
</script>

2 个答案:

答案 0 :(得分:3)

来自manual

  

从jQuery 1.8开始,.ajaxStart()方法应仅附加到   文档。

     

从jQuery 1.9开始,jQuery全局Ajax事件的所有处理程序,   包括那些使用.ajaxStart()方法添加的内容,必须附加到   文献。

如果你无法解释我会为你拼出来;对事件作出反应的唯一正确方法是:

$( document ).ajaxSend(function() {
    alert("hello");
    console.log('ajaxStart triggered');
});

答案 1 :(得分:0)

在我的情况下,使用Jquery自定义事件。

例如

$('form').submit(
    function(){
        return $.ajax({
            url: $(this).attr("action"),
            data:data,
            processData: false,
            contentType: false,
            type: "POST",
            dataType : "json",
            success: function( result ) {
                $form.trigger('submit:success');
            },
            error: function( xhr, status, errorThrown ) {
                console.log( "Error: " + errorThrown );
                console.log( "Status: " + status );
                console.dir( xhr );
                $form.trigger('submit:error');
            },
            complete: function( xhr, status ) {
                $form.trigger('submit:complete');
                console.log( "The request is complete!" );
        }
    }
);


 $('form.SpecialForm').on('submit:success', myFunction1);

 $('form.OtherSpecialForm').on('submit:success', otherFunction);

 $('form.ThirdSpecialForm').on('submit:error', thirdFunction);

 $('form.OneMoreSpecialForm').on('submit:complete', oneMoreFunction);

 $('form.theLastSpecialForm').on('submit:complete', theLastFunction);