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值

回答

相關問題