点击动态生成的单选按钮

我试图提醒时动态生成的单选按钮被选中一些文本..这里是从小提琴的链接.. 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"); 
});

当我在单选按钮点击我我没有得到警觉..你们中的任何一个人请帮我看一下吗？

由于提前，阿什温

来源

2014-09-11 Ashwin B Chandrappa

大量以下的答案，所以我就解释的事情。你遇到的问题来自于当你绑定事件监听器$（'＃radioContainer input'）。on（'change'，...）'时，单选按钮还不存在，所以jQuery没有找到它。代表团在下面的工作中回答的原因是，您将事件侦听器绑定到存在_does_的'＃radioContainer'。然后，当点击发生时，您检查单击元素是否是单选按钮，到目前为止确实存在。 – flowstoneknight 2014-09-11 06:47:27

您的代码$("#radioContainer input").on("change",function(){}) 将事件处理程序直接连接到当前存在于DOM匹配的元素。

要在将来添加动态生成的元素的作品，你需要delegate事件处理程序，以一个共同的父元素：

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

以上将处理程序安装到#radioContainer，每当对应的事件（change在这种情况下）被触发（一般从孩子传播）时，它检查该事件对象是否与指定的选择器（input匹配在这种情况下），并调用处理程序因此。

Updated Fiddle

来源

2014-09-11 06:41:50

您需要使用.on()像下面动态生成的元素。这里.on()将改变事件绑定到其内部radioContainer

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

Demo

来源

2014-09-11 06:42:45

*在这里。on（）会将更改事件绑定到radioContainer *内的所有单选按钮 - 不正确。 – 2014-09-11 06:52:30

所有单选按钮尝试使用下面的代码

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

Updated fiddle

来源

2014-09-11 06:42:51 karan3112

你需要把输入定义为点击区域和放射性容器作为工作区域。

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"); 
           });

来源

2014-09-11 06:44:02

点击动态生成的单选按钮

回答

相关问题