更新数据属性时,jQuery $.data()未返回正确值

lhcgjxsq  于 2023-01-25  发布在  jQuery
关注(0)|答案(5)|浏览(121)

我有一个非常奇怪的问题。我不知道为什么$. data在更新数据属性后没有返回正确的值,即使元素在firebug中有正确的值。
演示:http://jsfiddle.net/gv5cR/

<div>
    <input type="text" name="price" id="price"/>
</div>
<button type="button" id="submit" data-price="100">Submit</button>
<div id="result"></div>
<script>
$(document).ready(function(){
    $('#price').change(function(){

        $('#submit').attr('data-price',$(this).val());

    });

    $('#submit').click(function(){
        $('#result').html($(this).data('price'));
    });

});
<script>
4szc88ey

4szc88ey1#

使用相似

$('#submit').click(function(){
    $('#result').html($(this).attr('data-price'));
});
mv1qrgav

mv1qrgav2#

应使用.data()设置数据

$('#submit').data('price',$(this).val());

演示--->http://jsfiddle.net/gv5cR/2/

wsewodh2

wsewodh23#

由于您已经使用.attr()设置了data-price值,因此需要使用.attr()而不是.data()来获取该值:

$('#result').html($(this).attr('data-price'));
    • 一个
wnavrhmk

wnavrhmk4#

data-*属性仅用于初始化内部jQuery缓存中未找到的数据值......一旦该值被复制到jQuery数据缓存中,对该属性所做的任何更改都不会反映在jQuery的数据值中。
如果要更新jQuery数据中的值,则必须使用data api,而不是更改data-*属性。
演示:Fiddle

vsdwdz23

vsdwdz235#

就用

$('#submit').click(function(){
    $(this).attr('data-price');
});

相关问题