jQuery：获取每个选中的单选按钮并追加它的datasrc值

我在尝试使用each（）两次时遇到问题。jQuery：获取每个选中的单选按钮并追加它的datasrc值

我有一个单选按钮列表，每个按钮都有一个网站的datasrc。

例子：

<input type="radio" checked datasrc="www.john.com" id="John">John<br/> 
<input type="radio" checked datasrc="www.maria.com" id="Maria">Maria<br/> 
<input type="radio" datasrc="www.joe.com" id="Joe">Joe<br/>

我想要检索每个选中的单选按钮，所以我这样做：

$("input:radio").each(function(){ 

var name = $(this).attr("id"); 


    if($("[id="+name+"]:checked").length == 1) 
    { 
     var src = $('#' + name).attr("datasrc")                                                                                                                  

     console.log(name); 
     console.log(src);       

    }                                                                                                                   
});

现在，当我检索每个检查单选按钮，我想与ID其追加了id和value，它的datasrc。例如：

<div id="John">www.john.com</div> 
<div id="Maria">www.maria.com</div>

当我试图再次使用每个我得到设法得到它打印，但几次。例如约翰将打印4次，玛丽亚将打印5次（id的数量）。

例如：

$("input:radio").each(function() { 

    var name = $(this).attr("id"); 

    if ($("[id=" + name + "]:checked").length == 1) { 
     var src = $('#' + name).attr("datasrc") 

     var html = ""; 
     for (i = 0; i < name.length; i++) { 
     html += "<div id='" + name + "'>" + src + "</div>" 
     } 

     $("body").append(html); 


    } 

});

会打印：

www.john.com 
www.john.com 
www.john.com 
www.john.com 
www.maria.com 
www.maria.com 
www.maria.com 
www.maria.com 
www.maria.com

我我做错了什么？

来源

2012-03-17 jQuerybeast

这是因为你在每一个嵌套一个for循环，所以for循环的结果可以像每个循环一样运行多次...你不需要for循环，但是一个简单的数组，并且将会和each()工作：

编辑：使它成为一个功能，所以你可以在任何时候使用它。

var getUrls = function() { 

    var urls = []; 

    $('input:radio').each(function() { 

     var $this = $(this), 
      id = $this.attr('id'), 
      url = $this.attr('datasrc'); 

     if ($(this).prop('checked')) { 
      urls.push('<div class="' + id + '">' + url + '</div>'); 
     } 

    }); 

    return urls; 

}; 

$('body').append(getUrls().join(''));

来源

2012-03-17 08:52:20 elclanrs

工程很棒。你需要改变URL与思想。谢谢 – jQuerybeast 2012-03-17 08:54:13

刚刚注意到。 – elclanrs 2012-03-17 08:55:43

我会使用下面建议的类tho – elclanrs 2012-03-17 08:56:48

“身份证号码”让我刺痛了我的耳朵。每个ID在每个页面上可能只有一次。如果您在多个元素上使用相同的ID，则标记将是非法的。

来源

2012-03-17 08:51:14 devnull69

我会用一次笑。将它命名为课程，对我来说没有什么不同，因为我是创建标记的人。 – jQuerybeast 2012-03-17 08:51:56

当前您正在创建与相应单选按钮具有相同ID的DIV，这是非法的！ – devnull69 2012-03-17 09:00:19

是的，在我的现实生活中，单选按钮位于一个完全不同的页面中，传入数据库并在其他页面中检索到相应的ID。 – jQuerybeast 2012-03-17 09:01:16

我觉得你的脚本可能过于简化，像这样：

$("input:radio").each(function() { 

    // save for re-use 
    var $this = $(this); 

    // no need for jquery for javascript properties 
    // 'this' is the DOM element and has a 'checked' property 
    if (this.checked) { 
     var src = $this.attr('datasrc'); 
     // you'd have to prefix the generated DIV id 
     // otherwise you'll end up with duplicate IDs 
     $('body').append("<div id='div" + this.id + "'>" + src + "</div>"); 
    } 

});

DEMO

来源

2012-03-17 08:57:46

我解决你的问题http://jsfiddle.net/3nvcj/

$(function() { 

    $(':checked').each(function(index, element) { 

     $('#result').append($('<div>').attr('id', $(element).attr('id')).text($(element).attr('datasrc'))); 
    }); 
});

来源

2012-03-17 09:06:53 Simon

jQuery：获取每个选中的单选按钮并追加它的datasrc值

回答

相关问题