1

次の問題が発生しました。私がしようとしているのは、ID #add_new_row のボタンをクリックするたびに新しい TR を作成することです。クリック イベントは、CLASS p_pocet を持つ入力を含む行を追加します。クリックする前に、ページが読み込まれるたびに最初の TR を生成するので、関数 countPolozky() を呼び出して、入力に必要な BLUR 関数を与えます。問題は次のようなものです: 1) 最初のページの読み込み時に、ページ上の 1 つの入力のみをクリックすると、クリックした行の入力の正しい値でアラートが表示されます。2) ボタンをクリックして新しい行を追加した後。jquery は新しい行を追加し、関数 countPolozky() を再度呼び出します。(私がそれを呼び出さない場合、BLUR 関数は最初の TR の入力にのみ反応します)。新しいTRの入力をクリックすると、フォーカスを終了した後、再び正しいアラートが表示されますが、最初のTRをクリックすると、2つのアラートが表示されます。クリックしたアクティブな行の値を取得するアラートが 1 つだけ必要です。他の行を追加すると、アラートが増えるだけです。

     ( function($) {
        $(document).ready(function() {

                    $("#add_new_row").click(function(){
                      var pocet = parseInt($("#tbl_rows_count").attr('value')) + 1;
                      $("#tbl_rows_count").val(pocet);
                      $("#add_new_row").before('<tr></td><td><input name="pocet[]" id="pocet'+                    pocet +'" class="polozky p_pocet" type="text" value="1.0"></td></tr>');
                      $(".add_news2").click(function(){
                          $(this).parents('tr').remove();
                      });
                      countPolozky();
                    });
                    countPolozky();
       });
    } ) 
( jQuery );

     function countPolozky()    
        {
            //$(".polozky").die("blur");
            $(".polozky").blur(function() {
                pocet = $(this).closest('tr').find('.p_pocet').val();
                alert(pocet);
            });    
        }

ここでライブの問題を見ることができます。フォームの最後に請求書を作成するための Web サイトです。ITEMS を追加するための入力があります。ここに問題があります。 http://www.vzor-faktury.cz/#vygenerovat-fakturu

4

1 に答える 1

0

いくつかのオプションがあります。

  1. 新しい要素を作成するときは、すべてではなく、新しい要素にのみ新しいイベント ハンドラーをバインドします.polozky。
  2. イベント委任を使用します。

.polozkyイベント委任を使用すると、テーブル内のすべての要素のすべてのぼかしイベントを処理するコンテナー オブジェクト (テーブル要素など) に単一のイベント ハンドラーを設定できます。.polozkyしたがって、新しいイベント ハンドラーをバインドすることなく、必要なすべての要素を動的に追加/変更/削除できます。

参照として使用できるイベント委任について説明している投稿がいくつかあります。

于 2012-11-29T01:41:29.147 に答える