點擊動態生成的單選按鈕

我試圖提醒時動態生成的單選按鈕被選中一些文本..這裏是從小提琴的鏈接.. 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

點擊動態生成的單選按鈕

回答

相關問題