javascript - JQuery 获取返回未定义的数据属性

Question

我试图从单击的标签中获取 data-scanID 的值并将其存储在名为 scanID 的变量中，但警报未定义。

$("#trucklist").click(function(event) {
    var scanID=$(event.target).data("scanID");
    alert(scanID);
});

html 看起来像这样:

<ul id="trucklist">
    <li data-scanID=*somedata*>
        <ul>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
        </ul>
    </li>
    <li data-scanID=*somedata*>
        <ul>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
        </ul>
    </li>
    <li data-scanID=*somedata*>
        <ul>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
            <li>*stuff*</li>
        </ul>
    </li>
</ul>

Answer 1

您正在定位 ul。试试这个:

$("#trucklist > li").click(function(event) {
    var scanID=$(this).data("scanID");
    alert(scanID);
});

以上内容将针对 trucklist 的子 li 并提醒您其数据。

此外，我建议您将属性的值括在引号内。

此外，数据属性不能包含大写字母。因此请更改它们，否则它将不起作用。

Demo