防止多个ajax查询

Question

我有一个灯箱形式，以新的条目添加到我的数据表中，此代码箱工作形式：

$("#add-quotation").click(function(event) {
event.preventDefault(); 
var customer_id = $(this).attr('data-customer');    
$.nmManual(
    '#quotation_manage',{
        sizes: {    // Size information
        w: 500, // Initial width
        h: 500  // Initial height
    }
    });
    $('#quotation_submit').live('click', function(event){
    event.preventDefault();
    if(typeof($.nmTop()) != "undefined"){
        $.nmTop().close();
    }   
    var loading = $('.loading-notification');
    loading.removeClass('hidden');
    var date = $('#date_activate').val();
    var budget = $('#budget').val();
    var hospital = [$('#hospital').val(), $('#hospital option:selected').text()];
    var dental = [$('#hospital').val(), $('#hospital option:selected').text()];
    var optical = [$('#optical').val(), $('#optical option:selected').text()];
    var doctor = [$('#doctor').val(), $('#doctor option:selected').text()];
    $.ajax({
                type: 'POST',
                data: 'create=true&customer_id=' + customer_id + '&date=' + date + '&budget=' + budget + '&hospital=' + hospital[0] + '&dental=' + dental[0] + '&optical=' + optical[0] + '&doctor=' + doctor[0], 
                url: 'quotation.php', 
                dataType: 'json',
                async: false,
                success: function(result){
                    if (result){
                    oTable.fnAddData([
                        result.id,
                    result.date,
                    budget,
                    hospital[1],
                    dental[1],
                    optical[1],
                    doctor[1],
                    '',
                    '',
                    '',
                    'test'
                    ]);
            }
        loading.addClass('hidden');
                }
        });
    });
});

它工作得很好但有时会发送3个或更多查询，我该如何防止这种情况？ 通常它应该只发送一个查询。

Answer 1

单击#add-quotation ，将另一个单击事件绑定到#quotation_submit 。 因为你正在使用live你可以安全地将其移出。 尝试这个：

$("#add-quotation").click(function(event) {
    event.preventDefault();
    var customer_id = $(this).attr('data-customer');
    $.nmManual('#quotation_manage', {
        sizes: { // Size information
            w: 500,
            // Initial width
            h: 500 // Initial height
        }
    });
});
$('#quotation_submit').live('click', function(event) {
    event.preventDefault();
    if (typeof($.nmTop()) != "undefined") {
        $.nmTop().close();
    }
    var loading = $('.loading-notification');
    loading.removeClass('hidden');
    var date = $('#date_activate').val();
    var budget = $('#budget').val();
    var hospital = [$('#hospital').val(), $('#hospital option:selected').text()];
    var dental = [$('#hospital').val(), $('#hospital option:selected').text()];
    var optical = [$('#optical').val(), $('#optical option:selected').text()];
    var doctor = [$('#doctor').val(), $('#doctor option:selected').text()];
    $.ajax({
        type: 'POST',
        data: 'create=true&customer_id=' + customer_id + '&date=' + date + '&budget=' + budget + '&hospital=' + hospital[0] + '&dental=' + dental[0] + '&optical=' + optical[0] + '&doctor=' + doctor[0],
        url: 'quotation.php',
        dataType: 'json',
        async: false,
        success: function(result) {
            if (result) {
                oTable.fnAddData([
                    result.id, result.date, budget, hospital[1], dental[1], optical[1], doctor[1], '', '', '', 'test']);
            }
            loading.addClass('hidden');
        }
    });
});

Answer 2

使用one（）vs live（）可以防止多次提交。 与使用on（）相同，除了在第一次事件发生后删除处理程序。

http://api.jquery.com/one/