JQuery HTML данные атрибута не возвращает значение

Question

Вот мой HTML:

<ul class="inboxList"> 
    <li data-selecttype='global|mailbox|inbox'>Inbox</li> 
</ul> 

А вот мой JQuery код:

$(".inboxList").children().each(function(child){ 
    console.log($(child).data("selecttype")); 
}); 

Я также попытался вынимая $() у ребенка:

$(".inboxList").children().each(function(child){ 
    console.log(child.data("selecttype")); 
}); 

Но это не сработало.

Мои возвращаемые значения являются нулевыми и неопределенными. Я ожидал, что возвращаемое значение будет global|mailbox|inbox Что я делаю неправильно?

Спасибо за помощь!

Answer 1

Вы используете неправильный аргумент от обратного вызова each. Вы должны использовать второй arg для элемента или вырезать аргументы и просто использовать this. он должен быть:

$(".inboxList").children().each(function(i, child){ // each has 2 args first one is index and second one is the element. 
    console.log($(child).data("selecttype")); //Or this 

    console.log($(this).data('selecttype')); 
}); 

http://jsfiddle.net/JUyHg/

.each (функция (индекс, Element))

Answer 2

Попробуйте это,

$(".inboxList").children().each(function(){ 
    console.log($(this).data("selecttype")); 
}); 

Согласно определению на JQuery-х site, .each() принимает 2 аргумента, index и Element, где

индекс - это индекс текущего элемента в наборе в объекте JQuery возвращаемого .each()

И

Element - это текущий элемент в вашем случае

<li data-selecttype=​"global|mailbox|inbox">​Inbox​</li>​ 

Подробнее о .each()

Fiddle