2

次の onclick は、前のクリックのちょうど 2 倍の回数発生します。つまり、最初にクリックすると、意図したとおりに機能し、1 回だけ起動します。しかし、(同じ行または他の行で)もう一度クリックすると、2回起動します。3 回クリックすると、8 回、次に 16 回、次に 32 回起動します。どうしたの?

calcTotals: function (table){
        var totals=[];
        $(table).find('tbody').children('tr').each(function(r,row){

            $(row).on('click',function(e){
                $(this).toggleClass('selectedForTotal');
                $(table).find('tbody').children('tr:last').remove();
                dialog.calcTotals(table);
                e.stopPropagation();
                return false;
            })

             if($(row).hasClass('selectedForTotal')){
                $(this).children('td').each(function(c,cell){
                    if($(cell).hasClass('realNumber')){

                        cell.style.textAlign='right';
                        cell=$(cell).html().replace(/,/g,'').replace('(','-').replace(')','');
                        if (!totals[c]) totals[c]=0;
                        totals[c]+=parseFloat(cell);
                        $(cell).val(formatNumber(cell,2,false,true,true));

                    }else {cell.style.textAlign='left';}
                })
            }
        })

        var newRow=$('<tr>').appendTo($(table).find('tbody'))
            .attr({'id':'totals','class':'highlightRow','tabIndex':'1'})
            .on('click',function(i,item){
                $(this).toggleClass('highlightRow');
        }).css('cursor','pointer');

        console.log('total : '+totals);

        $(totals).each(function(i,item){
            $('<td>').html(item?   formatNumber(totals[i],2,false,true,true):'').appendTo(newRow);
        })

        $(newRow).focus();
    }
4

4 に答える 4

0

on() で新しい要素をアタッチする前に、off() で以前のハンドラーを削除する必要があります。このコードが役立つことを願っています..!!! $('body').off('click', '.collapsible').on("click", ".collapsible", function (e) { /* 何かをする */ });

于 2014-10-06T08:38:55.587 に答える
0

イベントが繰り返しトリガーされる理由は、イベントを繰り返しバインドしeach()ているためです。イベントをバインドする行にいくつかのクラスを割り当て、クラスセレクターを使用してイベントをバインドします。

 $(".rowclass").on('click',function(e){
        $(this).toggleClass('selectedForTotal');
        $(table).find('tbody').children('tr:last').remove();
        dialog.calcTotals(table);
        e.stopPropagation();
        return false;
 })
于 2013-04-12T09:17:13.847 に答える
0

event.preventDefault()を使用してデフォルト アクションを停止し、新しいアクションを登録できます。

これにより、要素にバインドされた以前のすべてのクリックが実行されなくなります....

于 2013-04-12T09:18:53.637 に答える
0

問題は、calcTotals関数がclickイベント ハンドラーをバインドするのに、clickイベント ハンドラーが呼び出すcalcTotalsことです (これにより、別のclickイベント ハンドラーがそれらのすべての要素にバインドされます)。

したがってcalcTotals、一度呼び出すと、click要素ごとに 1 つのイベント ハンドラーができます。それらの 1 つをクリックするcalcTotalsと、再度呼び出され、click要素ごとに 2 つのイベント ハンドラーが作成されます。次にもう一度クリックすると、両方のイベント ハンドラーが起動され、別の 2 つのclickイベント ハンドラー (合計 4 つ) がバインドされます。次にクリックすると、さらに 4 つ (合計 8​​ つ) 追加されます。

click関数とは別に、イベント ハンドラーを 1 回バインドする必要がありcalcTotalsます。

于 2013-04-12T09:19:41.797 に答える