jquery - 找到一个刚刚由 jQuery 添加的数据属性

Question

我正在使用 jQuery 向列表项添加属性。我稍后在代码中尝试通过搜索我刚刚添加的属性来访问这些列表项，但我得到“未定义不是函数”。

编辑:

这是我的代码的较大部分，因此您可以看到到底发生了什么:

var listItems = $('#list li');
    area = '';
    subarea = '';
    for (var i in areas) {
        if (areas.hasOwnProperty(i)) {
            area =  areas[i].area;
            listItems.find(".area:containsi('" + area + "')").each(function(e)
            {   
                for (var j = areas[i].subareas.length - 1; j >= 0; j--) 
                {
                    subarea = areas[i].subareas[j];
                    $(this).closest("li").attr("data-area", $(this).closest("li").attr("data-area") + subarea + ' ');
                }
                console.log($(this).closest("li").attr("data-area"));
            });         
        }
    }




    $('#search-input-field').on( {
        focus:  function() 
                {   
                    $(this).data('placeholder',$(this).attr('placeholder'));
                    $(this).attr('placeholder',''); 
                },

        blur:   function()  
                {   
                    $(this).attr('placeholder',$(this).data('placeholder'));
                },  

        keyup:  function() 
                {   
                    var searchTerm = $(this).val();
                    var searchSplit = searchTerm.replace(/ /g, "'):containsi('");


                    listItems.attr("data-area").not(":containsi('" + searchSplit + "')").each(function(e)   
                    {
                        $(this).addClass('hidden');
                    });

所以基本上我正在搜索列表项内的类中包含的内容，并向列表项数据添加属性。后来我搜索包含特定数据的列表项。

for循环中使用的变量区域是一个包含子区域信息的数组，如下所示:

areas = array(ID:{区域, array(子区域)})

“containsi”只是“contains”的扩展版本，它工作得很好，所以这不是问题。

我注意到我添加的数据属性没有显示在源代码中，让我相信 jQuery 以其他方式保存这些属性。我想这就是我收到错误的原因(因为 DOM 中不存在搜索的属性)。

有什么想法吗？

/奥洛夫

Answer 1

我想这对你会有帮助

首先，我编写 .each() 函数，在该函数内我检查属性是否存在。

示例代码

listItems.find(".area").each(function()
            {   
                var attr = $(this).attr("attributeNameHere");
                if (typeof attr !== 'undefined' && attr !== false) {
                    for (var j = areas[i].subareas.length - 1; j >= 0; j--) 
                    {
                        subarea = areas[i].subareas[j];
                        $(this).closest("li").attr("data-area", $(this).closest("li").attr("data-area") + subarea + ' ');
                    }
                    console.log($(this).closest("li").attr("data-area"));
                }

            });