更新HTML数据正确归属，但没有被

页

<input type="text" id="query" data-source="whatever">

我有一些jQuery的改变数据成功地属性，即“什么”变为“测试”

$(function() { 
    $('#query').data('source', 'test'); 
    console.log($('#query').data()); 
});

但如果我使用Chrome检查页面，数据属性尚未更新..我可以打印它，但我无法检查新值！非常混乱。有任何想法吗？

2012-02-02 ale

jsfiddle here：http://jsfiddle.net/r5YV9/7/ – ale 2012-02-02 15:50:01

的数据不被存储在元件（使用ATTR或丙为该）上。相反，jQuery将其保存在$ .cache中。

2012-02-02 16:10:03 Caleb

'$（'＃query'）.data（）'给出了与元素一起存储的所有数据属性的地图。 http://jsfiddle.net/r5YV9/10/。您不必使用'prop'或'attr'来访问它们。 – ShankarSangoli 2012-02-02 16:32:31

在你的小提琴，你有这样的代码。

$(function() { 
    $('#query') = $('#query').data('source', 'test'); 
    console.log($('#query').data()); 
});

其中有错误（“在分配无效左侧”），因为$('#query')是一个函数调用，你是assinging的.data('source', 'test')它的响应。

将其更改为

$(function() { 
    $('#query').data('source', 'test'); 
    console.log($('#query').data()); 
});

它将很好地工作。

2012-02-02 16:08:35 ShankarSangoli

如果你在做任何疯狂的事情，比如使用data属性来应用样式（不，它并不疯狂），那么你需要同时更新jQuery的缓存和。

换出了jQuery

$element.data(key, value);

这不会在DOM更新到执行都

var data = function($element, key, value) { 
    $element.data(key, value); 
    $element.attr('data-'+key, value); 
} 

data($element, key, value);

注方法：我总是把$ jQuery的变量的前面，任何人都会对此感到困惑。 ;）

2015-04-20 14:44:07 DanielM

回答