Блог

У меня есть динамически сгенерированный ol li список, и у каждого li есть label for атрибут with .

Вот так:

 <ol id="altErrorCont" class="error-container">
    <li>
        <label class="error" for="dobMonth">Enter the month you were born</label>
    </li>
    <li>
        <label class="error" for="dobDay">Enter the day you were born</label>
 

При загрузке страницы я хочу обернуть метки a тегом, который содержит привязку к for тегу внутри метки, которую он переносит. Это то, чего я хочу, чтобы произошло:

 <ol id="altErrorCont" class="error-container">
    <li>
        <a href="#dobMonth">
            <label class="error" for="dobMonth">Enter the month you were born</label>
        </a>
    </li>
    <li>
        <a href="#dobDay">
            <label class="error" for="dobDay">Enter the day you were born</label>
        </a>
 

Я написал это, но это не работает:

 var labelFor = $("ol#altErrorCont li label").each(function(){
    $(this).attr("for");
});

$('ol#altErrorCont li > label').wrap('<a href="#'  labelFor  '">');
 

Он возвращается <a href="#[object Object]"> для каждой обернутой метки. Может кто-нибудь указать мне правильное направление или объяснить, почему это происходит?

Заранее спасибо.

.each() Метод jQuery возвращает jQuery object . Когда вы используете его в строке contcatenation, JavaScript вызывает toString() для него метод. Поскольку в jQuery не определен свой собственный toString метод, он вызывает метод, определенный в том Object.prototype , который возвращает [object Object] .

Вот как я бы это сделал:

 var labelFor = $("ol#altErrorCont li label").each(function(){
    $(this).wrap('<a href="#'  $(this).attr("for")  '">');
});
 

each просто предоставляет средство итерации по набору элементов. Значение, которое вы получаете labelFor , будет таким же, как если бы вы сделали

 var labelFor = $("ol#altErrorCont li label");
 

Если вы хотите обернуть каждый label в ссылку, вы можете сделать это во время each цикла.

 $("ol#altErrorCont li label").each(function() {
  var $this = $(this); // Faster than always doing $(this)
  var label = $this.attr('for');
  $this.wrap('<a href="'   label   '">');
});
 

Это связано с тем, что метод «each» возвращает объект jQuery, вы можете переместить это: $('ol#altErrorCont li > label').wrap('<a href="#' labelFor '">'); внутри метода «each» следующим образом:

 $(this).wrap('<a href="#'  $(this).attr("for")  '">');