jQuery: получить каждый отмеченный переключатель и добавить значение datasrc.

Question

У меня возникла проблема при попытке использовать каждую () дважды.

У меня есть список радио-отмеченных кнопок, для каждой из которых есть данные сайта.

Пример:

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

    }                                                                                                                                                                                                                                                                                                                                                                                                                                                                        
});

Теперь, когда я получаю все отмеченные переключатели, я хочу добавить его с идентификатором и его идентификатором и длязначение, его данные.Например:

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

Когда я снова попробовал использовать каждый из них, мне удалось распечатать его несколько раз.Например, Джон напечатает 4 раза, а Мария напечатает 5 раз (сумма идентификатора).

Например:

$("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

Что я не так делаю?

Answer 1

Это потому, что вы вложили цикл 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(''));

Answer 2

Я думаю, что ваш сценарий может быть слишком упрощен, как это:

$("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

Answer 3

Я решил вашу проблему http://jsfiddle.net/3nvcj/

$(function() {

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

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

Answer 4

«Количество идентификаторов» заставляет меня колоть в уши.Каждый идентификатор может быть только один раз на каждой странице.Если вы используете один и тот же идентификатор для нескольких элементов, разметка будет недопустимой.