Question

我不知道我是否发现了一个潜在的jQuery错误，但请查看以下案例。

如果我正在动态更改data-ajax-link属性，然后尝试使用$('something').data('ajax-link');获取它的值，则在动态更改之前，检索到的值仍然是旧值。

这是一个例子。这是一个自定义dropDown，它将clicked选项设置为ul的第一个子节点。使用单击选项的值更新元素的名称以及first-child的data-ajax-link ... http://jsfiddle.net/RLF3W/1/

$('.select .option').live('click', function (e) {
    e.stopPropagation();
        $(".select .option:not('.darr')").hide();
        selectedOption = $(this).parents("div.select").find(".option:first");

        $(this).siblings().show();
        selectedOption.text($(this).text()).attr('data-ajax-link', $(this).data('ajax-link'));
});

$('.select .option:not(".darr")').live('click', function () {
    $(this).parents("div.select").find(".option:not('.darr')").hide();
});

$(window).click(function() {
    $(".select .option:not('.darr')").hide();
});


$('a#tester').live('click', function(e) {
    e.preventDefault();

    //var sort = $('#sortb .darr').attr('data-ajax-link');
    var sort = $('#sort .darr').data('ajax-link');

    $('#output').text(sort)

});

在我的示例中，您可以看到在下拉列表中选择其他选项然后点击测试链接后，data-ajax-link的值仍然是原始值，即使在检查元素时它实际上已更改。如果我使用.attr('data-ajax-link')来获取更新的值，它可以正常工作。

我在这里错了，我做错了什么还是这个错误？

Answer 1

您使用.attr()进行设置，但使用.data()进行设置。

我非常确保在通过.data()时，它首先查看jQuery.cache中的数据以查看该属性是否存在。然后如果没有，它会查找属性。

您应该通过data-属性发送，但使用.data()来获取和设置。

改变这个：

selectedOption.text($(this).text()).attr('data-ajax-link', $(this).data('ajax-link'));

到此：

  // Use .data()----------------------v
selectedOption.text($(this).text()).data('ajax-link', $(this).data('ajax-link'));

示例： http://jsfiddle.net/RLF3W/5/

动态更改属性时jQuery data（）的潜在错误？

1 个答案: