如何使用 jQuery Selector 選擇列表中的所有項目

Question

我正在這些行上創建一個動態列表：

<li class="MainMenuList" data-role=list-divider>
    <li data-icon=check id="1">
        <a name="n1" id="id-1">Text-1</a>
    </li>
    <li data-icon=check id="2">
        <a name="n2" id="id-2">Text-1</a>
    </li>
    <li data-icon=check id="3">
        <a name="n3" id="id-3">Text-1</a>
    </li>
</li>

如何運行 JQuery .each() 選擇器來訪問列表中的所有值。 嘗試這個不會產生螞蟻結果。

$( ".MainMenuList li a" ).each(function( index ) {
    var n1 = $(this).attr('name');
    var n2 = parseInt ($(this).attr('id'));
    alert( index + "-" + n1 + "-" + n2);
});

Answer 1

您的 HTML 無效，外部 li 應該是 ul 才有效。

<ul class="MainMenuList" data-role=list-divider>
    <li data-icon=check id="1">
        <a name="n1" id="id-1">Text-1</a>
    </li>
    <li data-icon=check id="2">
        <a name="n2" id="id-2">Text-1</a>
    </li>
    <li data-icon=check id="3">
        <a name="n3" id="id-3">Text-1</a>
    </li>
</ul>

這條線

var n2 = parseInt ($(this).attr('id'));

是相同的

var n2 = parseInt("id-2");

並且 parseInt 不會返回 2，它會返回 NaN。

您將不得不使用正則表達式

$(this).attr('id').match(/\d+/)[0]

或拆分拉出號碼

$(this).attr('id').split("-")[1]

或者，如果這是一個有效的假設，您可以只引用父母的 id。

$(this).parent().attr('id')

Answer 2

您正在對字符串調用parseInt() 。 如果您知道您的 ID 將始終采用id-N的形式，您可以這樣做

var id = $(this).attr("id");
var n2 = parseInt(id.split("-")[1]);

Answer 3

這是你的代碼的jsFiddle

• 正如評論中提到的，你的第一個<li>元素應該是一個<ul>
• 您還應該將<a> id更改為嚴格的數字（因為您將其解析為整數）或僅檢索數字部分（通過substr或其他方式）