1

$（window）.loadでjqueryを使用して、次のコードでボタンの行を初期化しています。

$(window).load(function() {
    var numButt = 0;

    randArr = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21]

    var Row = $(document.createElement('div')).attr("id", 'row1');
    Row.appendTo(".rows");

    for (;numButt < 22; numButt++){

        var newBut = $(document.createElement('span')).attr("id", 'but' + numButt);
        newBut.html('<input type="button" name="But' + numButt + '" id="case' + (numButt+1) + '" value= ' + randArr[numButt] + '>');
        newBut.appendTo($(".rows").find("#row1"));
        }
    }
 );

次に、クリックを処理するためにこれがあります。

$(document).ready(function(){

    $(".rows > div > span > input").click(function () {
    alert(this.id);
    });
});

そして、スクリプトブロックの終了後：

<div class='rows'>
    <div id='lol'>
        <span>
        <input type = 'button' name = 'test1' id = 'test1' value = 'test1'>
        </span>
        <span>
        <input type = 'button' name = 'test2' id = 'test2' value = 'test2'>
        </span>
    </div>

</div>

したがって、トポロジ的には、2つのテストボタンと初期化した22個のボタンの1つは同じである必要があります。しかし、それは2つのテストボタンのクリックを認識するだけです。私は何が間違っているのですか？

4

2 に答える 2

2

他のボタンは動的に追加されるため、イベントを委任する必要があります。これは。で行うことができますon()。

$('.rows').on('click', 'input', function () {
    alert(this.id);
});
于 2012-07-31T03:42:32.537 に答える
0

おっと。私はあなたの質問を逆に読んだ。とにかく、DOMで要素を作成する方法と、HTMLマークアップを交換可能に発行する方法に問題があるのではないかと思います。代わりに、20以上のボタンのすべてのhtmlマークアップを作成してみて、そのマークアップを1回だけ発行してください。次のようなものです。$（ "＃div1"）。html（buttons.split（''））//ここで、buttonsは、ボタンのhtmlを構成するために使用される文字列の配列です。次に、.clickが機能するはずです。これは、明らかに問題がないためです。

于 2012-07-31T03:56:03.233 に答える