Question

我正在使用jQuery将信息发布到PHP文件中，我刚刚意识到该帖子每次都会翻倍。例如，我第一次按它，它会发布一次，当我返回并更改我的表单信息并再次提交它将发布两次。如果我再次这样做，它将发布四次，然后八次，十六次等等。使我的应用程序非常缓慢。我已经发布了下面按钮的代码。有什么可能导致双重增加的想法吗？顺便说一句，我用Firebug来发现这个故障。

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

    var selected = $('#preferenceTabs').tabs().tabs('option', 'selected');

//  alert($('input:checkbox[name=dayNight-radio]:checked').val());

    // ----------------------------------- Simple Time Preference ---------------------------------------------- //
     //     e.preventDefault();
    // MONDAY, WEDNESDAY, FRIDAY --------------------------------
    MWFStart = convertTime($('#MWFStartHour').val(),$('#MWFStartMinute').val(),$('#MWFStartMeridian').val());
    MWFEnd = convertTime($('#MWFEndHour').val(),$('#MWFEndMinute').val(),$('#MWFEndMeridian').val());

    // TUESDAY, THURSDAY --------------------------------
    TRStart = convertTime($('#TRStartHour').val(),$('#TRStartMinute').val(),$('#TRStartMeridian').val());
    TREnd = convertTime($('#TREndHour').val(),$('#TREndMinute').val(),$('#TREndMeridian').val());

           // ----------------------------------- Advanced Time Preference ---------------------------------------------- //
    // MONDAY --------------------------------
    MStart = convertTime($('#MStartHour').val(),$('#MStartMinute').val(),$('#MStartMeridian').val());
    MEnd = convertTime($('#MEndHour').val(),$('#MEndMinute').val(),$('#MEndMeridian').val());


    // TUESDAY --------------------------------
    TStart = convertTime($('#TStartHour').val(),$('#TStartMinute').val(),$('#TStartMeridian').val());
    TEnd = convertTime($('#TEndHour').val(),$('#TEndMinute').val(),$('#TEndMeridian').val());


    // WEDNESDAY --------------------------------
    WStart = convertTime($('#WStartHour').val(),$('#WStartMinute').val(),$('#WStartMeridian').val());
    WEnd = convertTime($('#WEndHour').val(),$('#WEndMinute').val(),$('#WEndMeridian').val());


    // THURSDAY --------------------------------
    RStart = convertTime($('#RStartHour').val(),$('#RStartMinute').val(),$('#RStartMeridian').val());
    REnd = convertTime($('#REndHour').val(),$('#REndMinute').val(),$('#REndMeridian').val());


    // FRIDAY --------------------------------
    FStart = convertTime($('#FStartHour').val(),$('#FStartMinute').val(),$('#FStartMeridian').val());
    FEnd = convertTime($('#FEndHour').val(),$('#FEndMinute').val(),$('#FEndMeridian').val());

    // Since SEMESTER is a must for searching for classes, we must create some sort of error notifying the user of the issue. Same goes with adding NO classes.
    // Create IF statement, and check for an empty string.
    // Also create an error if Time Preference times are incorrect, for example, if Starting time > ending time is not valid.

    $.post('search.php', { 'searchClasses[]':tbl.fnGetData(), 'semester' :$('#term').val(), 'MWFStart' : MWFStart, 'MWFEnd' : MWFEnd, 'TRStart' : TRStart, 'TREnd' : TREnd, 'MStart' : MStart, 'MEnd' : MEnd, 'TStart' : TStart, 'TEnd' : TEnd, 'WStart' : WStart, 'WEnd' : WEnd, 'RStart' : RStart, 'REnd' : REnd, 'FStart' : FStart, 'FEnd' : FEnd, 'WeekendStart' : WeekendStart, 'WeekendEnd' : WeekendEnd, 'selectedPreference' : selected} , function(data) {
        $("#resultTblContainer").html(data);
        var resultTbl = $("#resultTblContainer > table").dataTable( {
            "bAutoWidth": true,
            "bPaginate": false,
            "bLengthChange": true,
            "bFilter": false,
            "bSort": false,
            "bInfo": false,
            "bJQueryUI": true
        });
        $("#tabs").tabs("select", $("#tabs").tabs("length")-1);
        resultTbl.css('width', '100%'); //make sure table fills its container
    });

});

Answer 1

也许click - 事件将被绑定多次。例如。您可以在之前添加unbind：

$("#preferenceSubmit").unbind().click(function() {
    ...

Answer 2

$("#preferenceSubmit").click(function(e) {
e.preventDefault();

// other code

});

或

$("#preferenceSubmit").click(function() {
// other code
return false;
});

要阻止表单多次使用按钮提交，请单击：

var form_submitted = false;
$("#preferenceSubmit").click(function(e) {
    e.preventDefault();
    if(form_submitted) return false;
    else form_submitted = true;
    // other code
    $.post("search.php", {}, function(data){
        // code here
        form_submitted = false;
    });
});

每次POST后jQuery $ .post提交加倍

2 个答案: