jQuery.data(）返回'未定义'当从动态元素检索数据时

jQuery.data() returns 'undefined' when retrieving data from dynamic elements

本文关键字：元素 动态 检索 数据 返回 data jQuery 未定义      更新时间：2023-09-26

我的情况很简单，我只是尝试将数据存储到DOM中动态appended的元素中。我的问题是，每当我试图通过即时appended object检索数据时，值都会返回良好，但通过click事件通过on函数返回的对象，它会返回undefined。我早些时候搜索过这件事，但斯塔克夫弗洛的人只是被建议拆除骆驼套等。这对我的情况没有帮助。任何建议或修复都会更有帮助。

我的代码：

$(document).ready(function(){
    xElement = $('<li class="test">click this (because this contains data)</li>').appendTo('ul');
    jQuery.data(xElement,"val","value1");
    alert(jQuery.data(xElement,'val'));
    $(document).on('click','ul li',function(){ alert(jQuery.data($(this),'val')); });
     });

A Fiddle：

此处

jQuery.data()采用原始DOM元素，而不是jQuery对象。

您需要直接传递this，或者调用实例方法（$(this).data()）

$(document).ready(function(){
    xElement = $('<li class="test">click this (because this contains data)</li>').appendTo('ul');
    xElement.data("val","value1");
    //retrieving data from immediate object
    alert(xElement.data('val'));
    $(document).on('click','ul li',function(){ 
        //retrieving data through object from 'on'
        alert($(this).data('val')); 
    });
});

很奇怪，但如果你这样做，似乎效果不错。

FIDDLEMETHIS

谢谢DevlshOne，这开始让我有点头疼——我不能给你投票或评论，因为我没有足够的声誉。

但是，如果有人使用数据表，这就解决了任何隐藏值的问题（因为默认表只显示1-10），并且您不能访问11+中的数据属性，因为它们是在之后动态生成的。

旧代码

$('.userId').on('click', function(){ var userId = $(this).data('id');

新代码

$(document).on('click', 'td', function(){ var userId = $(this).data('id');

感谢

相关文章：