javascript - 如何获取动态生成的按钮的ID

Question

我自动生成了一些按钮

    <div class="wrapper" id="wrapper"></div>
<script type="application/javascript">
    var x, i, y;
    for(i = 0; i <= 10; i++){
        y = i;
        x = "<button class=btn_class"+y+"id=btn"+y+"onclick(alert(this.id);>Ukor</button>";
        $("#wrapper").append(x);
    }

    $("button").on("click", function(){
        alert(this.id);
    });
</script>

我想在单击任何按钮时执行不同的操作。 但我似乎无法通过 id 获取按钮。我还需要将 y 作为参数发送给函数

Answer 1

问题是属性之间没有空格分隔。因此，您要创建一个如下所示的元素:

<button class=btnclass0id=btn0onclick(alert(this.id);>Ukor</button>

因此，所有内容都将进入 class 属性。您应该在属性值两边加引号，并在属性之间加空格。

也不需要 onclick 属性，因为您使用 $("button").on("click", ...) 来执行那个。

所以应该是:

x = "<button class='btn_class"+y+"' id='btn"+y+"'>Ukor</button>";

您还可以使用 jQuery 面向对象的方式来创建元素:

x = $("<button>", {
        "class": "btn_class" + y,
        "id": "btn"+y,
        text: "Ukor"
});

顺便说一句，为什么你要把 y 放在类中？通常，类的要点是让所有相似的元素具有相同的类，这样您就可以一次性解决所有这些问题。