Question

我正在尝试在检查动态生成的单选按钮时提醒某些文本。这里是来自小提琴的链接.. http://jsfiddle.net/z7cu3q0y/

function createRadioButtons(n)
{
    $("#radioContainer").empty();
    for(var i=0;i<n;i++)
    {
        radioButtons = "<p><input type='radio' class='"+n+"' name='"+n+"'>"+(i+1)+"</p>";
        $("#radioContainer").append(radioButtons);
    }
}    

$("#dropDown").on("change",function()
{
      createRadioButtons(parseInt($(this).val()));
});

$("#radioContainer input").on("change",function()
{
      alert("checked");
});

当我点击单选按钮时，我没有收到警报..你们中的任何人都可以帮我看看吗？

提前致谢，阿斯温

Answer 1

您的代码$("#radioContainer input").on("change",function(){}) 将直接将事件处理程序附加到DOM。

中当前存在的匹配元素

要使用将来添加的动态生成的元素，您需要delegate将事件处理程序Updated Fiddle转换为公共父元素：

$("#radioContainer").on("change","input",function(){
  alert("checked");
});

以上会将处理程序附加到#radioContainer，每当相应的事件（本例中为 change ）被触发时（通常从子项传播），它检查事件目标是否与指定的选择器匹配（在这种情况下为 input ）并相应地调用处理程序。

Answer 2

您需要将.on()用于动态生成的元素，如下所示。这里.on()会将更改事件绑定到radioContainer

内的所有单选按钮

$("#radioContainer").on("change","input[type=radio]",function()
{
      alert("checked");
});

<强> Demo

Answer 3

尝试使用以下代码

$(document).on("change","#radioContainer input",function(){
 alert("checked");
});

Updated fiddle

Answer 4

您需要将输入定义为点击区域和radiocontainer作为工作区域。

DEMO： http://jsfiddle.net/don/z7cu3q0y/3/

只需删除.on之前的输入并放入函数内部。

<强> jQuery的：

function createRadioButtons(n)
{
    $("#radioContainer").empty();
    for(var i=0;i<n;i++)
    {
        radioButtons = "<p><input type='radio' class='"+n+"' name='"+n+"'>"+(i+1)+"</p>";
        $("#radioContainer").append(radioButtons);
    }
}    

$("#dropDown").on("change",function()
{
      createRadioButtons(parseInt($(this).val()));
});

$("#radioContainer").on("change", 'input', function()
                              {
                                  alert("checked");
                              });

单击动态生成的单选按钮

4 个答案: