警报或控制台没有触发全局Ajax事件处理程序

我正在尝试全局Ajax事件处理程序的演示。

在我的代码中，.load方法工作，但我没有得到任何alert s或各种事件阶段(start/send/success/complete)的控制台消息。

有什么问题吗?

<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>

从手册:

从jQuery 1.8开始，.ajaxStart()方法只能附加到文档。

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

如果你不能解释，我将为你拼出来;对事件作出反应的唯一正确方法是这样做:

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

在我的例子中，我使用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);

相关内容

最新更新

热门标签：