javascript - 获取动态生成的 ID

Question

我有一个复选框，其中的值是从数据库中的数据动态填充的。我想根据单击的复选框执行进一步的查询，但是每当单击任何复选框时，我似乎都无法检索 ID。我不想使用提交按钮。如何才能实现这一点？

我的代码。

function getDBlist() {
            global $link;
            $qry = ("SHOW DATABASES");
            $res = mysqli_query ( $link, $qry );
            while ( $row = mysqli_fetch_assoc ( $res ) ) {
                echo '<input type="checkbox" name="db" id="' . $row ['Database'] . '"   value="' . $row ['Database'] . '" />';
                echo $row ['Database'];
            }
        }
        getDBlist (); 

我的脚本

$(document).on("change","checkbox", function() {
    var val = $(this).val();
    var id = this.id;
    alert(val, id);
});

当我单击任何复选框时，我没有收到包含值或 ID 的警报。我在这里做错了什么？难道是因为我动态生成的ID？

Answer 1

要将更改事件绑定(bind)到动态生成的复选框，您需要委托(delegate) change 事件，如下所示

$(document).on("change",".checkbox", function() {
    var val = $(this).val();
    var id = this.id;
    alert(val, id);
});

上面的代码适用于现有的和动态创建的复选框。这里的 document 对象将把更改事件委托(delegate)给带有 class="checkbox"

的复选框

同样正如@Ghost提到的，您需要将类添加到动态生成的复选框，如下所示

echo '<input type="checkbox" 
             name="db" id="' . $row ['Database'] . '"   
             value="' . $row ['Database'] . '" 
             class="checkbox"/>';

<强> More Information for .on()