Question

我需要一些帮助。我有一个div，里面有一些动态生成的单选按钮，每个单选按钮旁边还有一段文本也是动态生成的，在元素内部，如下所示：

<div class="mother_div"> 
   <input type="radio" class="child_radio" name="amount" value="0" />
   <span class="child_text">0.0 some text</span>
   <input type="radio" class="child_radio" name="amount" value="1" />
   <span class="child_text">1.0 some text</span>
   <input type="radio" class="child_radio" name="amount" value="2" />
   <span class="child_text">2.0 some text</span>
   <input type="radio" class="child_radio" name="amount" value="3" />
   <span class="child_text">3.0 some text</span>

我需要一个Jquery方法或函数，它允许我从mother_div开始，并在用户单击/检查单选按钮（它们都是未选中以开始）时，用“child_text”替换span中的文本具有不同HTML字符串的类。

到目前为止我尝试的是这个，但它不起作用：

$("div.mother_div input:radio[name=child_radio]").click(function() {
    var newHTML= "some HTML to insert";
    $(span.child_text).html(newHTML);
});

任何想法或建议高度赞赏。

Answer 1

试试这个

$("div.mother_div input").click(function() {
   var newHTML= "some HTML to insert";
   //this will change text next to radio button clicked
   $(this).next('span.child_text').html(newHTML);  

   //this will change text next to all the radio buttons
   $(this).parent().children('span.child_text').html(newHTML);
});

您的选择器无效。您可以在jsFiddle.net上查看change clicked one only或change all演示

希望这适合你。

Answer 2

$('div.mother_div input:radio[name="child_radio"]').click(function() {
    var newHTML= "some HTML to insert";
    $(this).next('span.child_text').html(newHTML);
});

JQuery选择单选按钮旁边的文本

2 个答案: