Question

在我的代码所在的表单中，每次单击optionForm div时都会触发微调器函数。第一次单击工作正常，并触发警报一次。再次点击，他们两次开火。三次点击三次，等等。问题出在哪里？

<script type="text/javascript">

$("#optionForm").click(function() { 

    $("#process").hide().ajaxStart(function() {
        alert("show")
        $("#process").fadeIn('100');    
    })   
    .ajaxStop(function() {
        alert("hide")
        $("#process").hide();
    });

    $.post('post_requests.php', {

        scenario: ($('#scenario:checked').length ? 1 : 0 ),
        toolkit: ($('#toolkit:checked').length ? 1 : 0 ),
        newsletter: ($('#newsletter:checked').length ? 1 : 0 ),
        scenarios: $('#scenarios').val(),
        tools: $('#tools').val(),
        news: $('#news').val(),
        submit: 'yes'}, function(data) {

            $("#optionResponse").html(data).fadeIn('100');

            FadeMsg();

        }, 'text');

    function FadeMsg() {

        waiting = setInterval(function() {
            $('#optionResponse').fadeOut(500);
            },3000);    
    };

    clearInterval(waiting);
    return false; 

});         
</script>

Answer 1

您应该将ajaxStart和 ajaxStop 来电置于点击处理程序之外。

如果你将它们保存在点击处理程序中，那么每次新的ajax请求开始或停止时，你都要添加一个新的回调。

文档甚至有一个类似于您尝试做的示例：

每当Ajax请求启动时显示加载消息（并且没有已经活跃了。）

Answer 2

这可能是因为每次点击optionForm时都会订阅一个函数。

试试这个。

$("#process").hide().ajaxStart(function() {
        alert("show")
        $("#process").fadeIn('100');    
    })   
    .ajaxStop(function() {
        alert("hide")
        $("#process").hide();
    });
$("#optionForm").click(function() { 
    // etc...
});

Answer 3

每次点击optionForm div时，点击事件都会被触发，它会将新的ajaxStart事件附加到$("#process")。所以第一次点击它时会附加一个事件。
它工作正常。
下次你再点击一次，附上一个事件并发射两次。相反，你shud将ajaxStart()和。ajaxStop()事件附加在advnace中，而不是在callign click click函数时

JQuery Spinner问题

3 个答案: