javascript - $('.add').live('クリック', 関数()

Question

javascript にオプションタグを入れることができないようです。私を助けてください。
私がやろうとしているのは、追加ボタンの機能です。

    var scntDiv = $('.input');
    var i = $('.input p').size() + 0;

$('.add').on('click', function() {
            $('<p><input type="text" name="barcode' + i + '" id="textbox_input1" placeholder="Barcode"/>                <input type="text" name="item' +i+ '" id="textbox_input1" placeholder="Item"/>              <input type="number" name="qtty' +i+ '" id="textbox_input1" placeholder="Quantity"/>                <input type="number" name="min' +i+ '" id="textbox_input1" placeholder="Minimum"/>              <select name="category' +i+ '" id="textbox_input1"/><option value="Grocery">Grocery</option><option value="Furniture">Furniture</option></select>               <input type="text" name="price' +i+ '" id="textbox_input1" placeholder="Price"/>                <input type="text" name="promo' +i+ '" id="textbox_input1" placeholder="Promo"/>                <button type="button" class="remove" id="button">Remove</button></p>').appendTo(scntDiv);
            i++;

            return false;

    });

私を助けてください。私の問題は、追加ボタンをクリックしてもオプション値が表示されないことです。これ

<select name="category' +i+ '" id="textbox_input1"/><option value="Grocery">Grocery</option><option value="Furniture">Furniture</option></select>

スクリプトでオプションを指定しません。

score 0 · Accepted Answer

.live() を使用せず、最新バージョンの jQuery 1.9.1 にアップグレードすることをお勧めします。

.live() は廃止され、.on() に置き換えられました
return false の代わりに preventDefault を使用します (予期しない動作を避けるため)
i++ はループ内でのみ機能するため、.each()の使用を検討してください

$('document').on('click', '.add', function(e) { e.preventDefault(); // 何かをする });

次回、あなたのコードについてさらに支援が必要な場合は、何を達成しようとしているのかを説明し、コードをもっと投稿して、問題に答えられる可能性を最大限に高めてください。

score 0 · Accepted Answer

この規範はベストプラクティスではありません。

変数 i は初期化されていません
同一の id タグが生成されます。
scntDiv は未定義の変数のようです。

score 0 · Accepted Answer

を使用して、オプションタグを記述する前に select 要素を閉じます<select/>。する必要があります<select>。つまり/、最初のタグの末尾にある余分な部分を削除します。

したがって、次のようになります。

<select>
  <option></option>
  <option></option>
</select>

これの代わりに：

<select/>
  <option></option>
  <option></option>
</select>

もちろん、以前に使用した属性を追加します。

また、残りの回答を確認することをお勧めします。

score 0 · Accepted Answer

ライブをオンに変更:

$('body').on('click', '.add', function() {
    // do something
});

注: 'body' を .add の親要素、できれば ID を持つ要素に変更します。

jQuery 1.9 .live() is not a functionおよびjQuery - how to use the “on()” method instead of “live()”?も参照してください。

JSfiddle: http://jsfiddle.net/samliew/tPdyT/

javascript - $('.add').live('クリック', 関数()

4 に答える 4

Related

Reference