【问题标题】:jquery function executed more than oncejquery函数多次执行
【发布时间】:2013-12-24 04:38:28
【问题描述】:

我在移动应用中。

我有一个创建动态复选框 (getItem1) 的函数,在这个函数中我调用另一个更新 sqlite 的函数。

function getItem1(flatname, flatdescription) {

    $(document).ready(function(){
    $('#Code').empty();
    $('#displayflat article3').empty();
    $('#displayflat article1').empty();
    $('#displayflat article2').empty();
    $('#shares').val('');
    });
        var gtotal=0;
        var total = 0;
        var payment = 0;
        var previouspayments = 0;
        var sofeilon = 0;
        var total1 = 0;
        var payment1 = 0;
        var previouspayments1 = 0;
        var sofeilon1 = 0;
        var len = 0;
        var list = $('#Code'),
            allbarcode = [],
            my = {},
            barcode = [],
            barcodeamount = [],
            barcodeprevious = [],
            items = [];

        $.mobile.notesdb.transaction(function(t) {
            t.executeSql('SELECT barcode, buildingcode, buildingaddress, flatname, flatdescription, entryseason, period, amount, pastpayments, todaypayments, paydate, receiptno FROM bill WHERE flatname = ? AND flatdescription = ?',
            [flatname, flatdescription],
            function(t, resultflatname) {
                var i,
                    ib,
                    len = resultflatname.rows.length,
                    row = 0,
                    rowprev = 0,
                    rowb = 0;

                for (i = 0; i < len; i += 1) {
                    row = resultflatname.rows.item(i);

    if (row.amount > row.todaypayments + row.pastpayments) {
                    if (row.receiptno == 0){
                        items.push('<input type="checkbox" name="code_'+ i +'" id="code_'+ i +'" value="' + row.amount + '" previous="' + row.pastpayments + '" barcode="' + row.barcode + '" todayp="' + row.todaypayments + '"/><label for="code_'+ i +'">' + row.period +'..........'+ row.amount+'</label></br>');
                    } else {
                    if ((row.receiptno > 0) && (row.amount > row.todaypayments + row.pastpayments)){
                        items.push('<input type="checkbox" name="code_'+ i +'" id="code_'+ i +'" value="' + row.amount + '" previous="' + row.pastpayments + '" barcode="' + row.barcode + '" todayp="' + row.todaypayments + '"/><label for="code_'+ i +'">' + row.period +'..........'+ row.amount+'</label></br>');


                    }
    }
                }
                        allbarcode[i] = row.barcode;
    //                  barcodeamount[i] = row.amount;
    //                  barcodeprevious[i] = row.pastpayments;
                        previouspayments1 = previouspayments1 + row.pastpayments;
                        previouspayments = previouspayments1.toFixed(2);
                        sofeilon1 = sofeilon1 + row.amount;
                        sofeilon = sofeilon1.toFixed(2);
                        total1 = sofeilon - previouspayments;
                        total = total1.toFixed(2);

                    list.html(items.join('\n'));

                $('#displayflat h1').text(row.flatname);
                $('#displayflat article').html('<h2>Flatname : ' + row.flatdescription + '</h2>');
                if (total != 0){
                    $('#displayflat article1').html('<p>Total : ' + total + '</p>');
                    $('#displayflat article2').html('<p>Months Total : ' + sofeilon + '</p>');
                }
                if (previouspayments != 0) {
                    $('#displayflat article3').html('<p>Previous Payments : <font color="red">' + previouspayments + '</font></p>');
                }
        }

                function calcTotal() {
                    $("input:checked").each(function() {
                        var value = [$(this).attr("value")]-[$(this).attr("previous")];
                        payment = payment + parseFloat(value); //total = total + value          
                    });
                }

                function barcodeTotal() {
                    barcode = [];
                    barcodeamount[i];
                    barcodeprevious[i];
                    $("input:checked").each(function(i) {
                        barcode[i] = $(this).attr("barcode");
                        barcodeamount[i] = $(this).attr("value");
                        barcodeprevious[i] = $(this).attr("previous");
                    });
                }

                calcTotal();
                $("#Payment").html('<p class="total">Total Payment: <strong>' + payment.toFixed(2) + '</strong></p>');

                $("input:checkbox, input:radio").click(function() {
                    payment = 0;
                    calcTotal();
                    $("p.total").html("Total Payment: <strong>" + payment.toFixed(2) + "</strong>");
                });

                $('#shares').keyup(function(){
                    payment = 0;
                    calcTotal();
                    gtotal = ($('#shares').val() * 1) + payment;
                    gtotal = gtotal.toFixed(2);
                    $("p.total").html("Total Payment: <strong>" + gtotal + "</strong>");
                });


                $('#shares').keyup(function(){
                    $("input:checkbox, input:radio").click(function() {
                        payment = 0;
                        calcTotal();
                        gtotal = ($('#shares').val() * 1) + payment;
                        gtotal = gtotal.toFixed(2);
                        $("p.total").html("Total Payment: <strong>" + gtotal + "</strong>");
                    });
                }); 

                $("#pay").click(function(e) {
                    barcodeTotal();
                    updateItem(payment.toFixed(2), gtotal, barcode, barcodeamount, barcodeprevious, allbarcode);
                });

            })
        });
}

还有updateItem的代码。我使用警报只是为了观察执行了多少次。

function updateItem(payment, gtotal, barcodetotal, barcodeamount, barcodeprevious, allbarcode) {
alert(allbarcode);
alert(barcodeamount);
alert(barcodeprevious);
    var i,
        j,
        len = barcodetotal.length,
        lenall = allbarcode.length,
        today,
        receiptno,
        row = [],
        barcodeamount,
        barcodeprevious,
        enanti = 0,
        newbarcode,
        pasttotal,
        minimum = 0,
        myrow;

    $.mobile.notesdb.transaction(function(t) {
        t.executeSql('SELECT userid, name, receiptno FROM collector', 
            [], function(t, resultcollector) {
                myrow = resultcollector.rows.item(0);
                receiptno = myrow.receiptno + 1;
                t.executeSql('UPDATE collector SET receiptno = ?', [receiptno]);

                if (payment > 0 && gtotal == 0) {
                    for (i = 0; i < len; i += 1) {
                        row = barcodetotal[i];
                            for (j = 0; j < lenall; j += 1) {
                                if (allbarcode[j] == row){
                                    var place = j;
                                }
                            }
                        allbarcode.splice(place, 1);
                        barcodeprevious.slice(place, 1);

                        today = barcodeamount[i] - barcodeprevious[i];
                        var billtoday = barcodeamount[i];
                        t.executeSql('UPDATE bill SET pastpayments = ?, receiptno = ?, paydate = date("now") WHERE barcode = ?', [billtoday, receiptno, row]);
                        t.executeSql('INSERT INTO billpayments (barcode, amount, collectorid, receiptno) VALUES (?,?,?,?)',
                            [row, today, myrow.userid, receiptno]);
                    }
                }


                    if (gtotal > 0) {   
                        enanti = gtotal - payment;
                        //alert(enanti);
                        var minimum = Math.min.apply( null, allbarcode );
                        alert(minimum);
                        t.executeSql('SELECT barcode, amount, pastpayments, todaypayments FROM bill WHERE barcode = ?',
                            [minimum], 
                            function(t, previousp) {
                                var myr = previousp.rows.item(0);
                                var todaypp = myr.pastpayments + enanti;

                                t.executeSql('UPDATE bill SET pastpayments = ?, todaypayments = ?, receiptno = ?, paydate = date("now") WHERE barcode = ?', [todaypp, enanti, receiptno, minimum]);
                                t.executeSql('INSERT INTO billpayments (barcode, amount, collectorid, receiptno) VALUES (?,?,?,?)',
                                    [minimum, enanti, myrow.userid, receiptno]);
                        });
                    }






                    $.mobile.changePage('#display', 'slideup', false, true);
            })
    });

}

第一次执行 getItem1 时一切正常。

对于 getItem1 的第二次执行 updateItem 我三思而后行。

getItem1 第三次 updateItem 3 次以此类推。

毕竟如果数据没问题我就看不下去了……

【问题讨论】:

  • 你昨天问了同样的问题here,我再次重申,你需要把你的 SQL 查询从你的 javascript 中取出

标签: jquery function mobile


【解决方案1】:

您不止一次地连接了您的点击事件。每次通过都需要移除点击事件。

将您的线路更改为:

$("#pay").click(function(e) {

到:

$("#pay").unbind('click').click(function(e) {

【讨论】:

  • 为什么要解绑并重新绑定点击事件?完全多余?
  • 因为他在循环使用它。每次调用主函数时,他都会将一个新的点击事件附加到#pay。您需要删除前一个事件以连接一个新事件,否则您会遇到他上面描述的问题(多次调用他的函数 updateItem())。
  • 这就是理查德所说的@RickBurns 为什么它甚至在一个循环中???除非您使用 javascript 或 ajax 进行填充,否则您应该只需要调用一次 click 函数。在这种情况下,您应该使用.on
  • @Henesnarfel 你应该问问题的作者为什么他的代码是某种方式。不是我写的,只能推测。
【解决方案2】:

移动

            $("#pay").click(function(e) {
                barcodeTotal();
                updateItem(payment.toFixed(2), gtotal, barcode, barcodeamount, barcodeprevious, allbarcode);
            });

在函数之外,进入document.ready并使用onhttp://api.jquery.com/on/

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-09-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-06-29
    相关资源
    最近更新 更多