1

我正在使用 jquery 在 $(window).load 上使用以下代码初始化一行按钮：

$(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>

所以，从拓扑上看，两个测试按钮和我初始化的 22 个按钮之一应该是相同的。但它只识别我点击两个测试按钮。我究竟做错了什么？

4

2 回答 2

2

由于其他按钮是动态添加的，因此您必须委托您的事件。您可以使用on().

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

哎呀。我以相反的方式阅读了您的问题。无论如何，我怀疑您在 DOM 上创建元素以及可互换地发出 html 标记的方式存在问题。相反，尝试为 20 多个按钮编写所有 html 标记，并一次性发出该标记。像这样： $("#div1").html(buttons.split('')) // 其中buttons是一个字符串数组，用于组成按钮的html。然后你的 .click 应该可以工作，因为我没有看到任何明显的错误。

于 2012-07-31T03:56:03.233 回答