所以我有一个DataTable
,我希望在我的data-paiement
的最后一个a
更新数据属性td
。这是一个例子:
<td class="dropdown open">
<a class="btn btn-default" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"><i class="fa fa-cog"></i></a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="/fr/admin/evenements/inscriptions/modifier?URL=noel-des-enfants-2017&id=3440">Modifier</a><br>
<a class="dropdown-item" href="#" data-delete-inscription="3440" onclick="DeleteInscription(3440, 'DEMN')">Supprimer</a><br>
<a class="dropdown-item btnPaiement" href="#" data-update-paiement="3440" data-paiement="1" data-acronym="DEMN">Changer le statut de paiement</a><br>
</div>
所以,当我点击它时,我调用了一个jQuery函数并发送了这个data attribute
:
$(document).on('click', '.btnPaiement', function () {
console.log($(this).data('paiement'));
ChangeStatusPaiement($(this).data('update-paiement'), $(this).data('acronym'), $(this).data('paiement'));
});
在ChangeStatusPaiement
中,我更新data-paiement
,如下所示:
$('a[data-update-paiement="' + id + '"]').attr('data-paiement', paye == 1 ? '0' : '1');
一切正常,HTML已更新,因此data-paiement
现在等于0
但是,当我重新点击它时,在我的jQuery Call的console.log($(this).data('paiement'));
中,data-paiement
值仍为1
是因为DataTable
没有更新他的价值吗?
谢谢!
答案 0 :(得分:2)
访问jQuery .data()
函数会创建一个包含元素数据属性值的内存中对象。使用jQuery .attr()
函数来更改属性值只会更新属性本身,但更改不会反映到jQuery处理的基础数据模型上。
在ChangeStatusPaiement
您可能需要替换:
$('a[data-update-paiement="' + id + '"]').attr('data-paiement', paye == 1 ? '0' : '1');
<强>与强>
$('a[data-update-paiement="' + id + '"]').data('paiement', paye == 1 ? '0' : '1');
这里有一个演示:
let $tester = $('span');
$('div').append($('<p />', {text: 'Accessing data the first time: '+$tester.data('test')}));
$tester.attr('data-test', 2);
$('div').append($('<p />', {text: 'Accessing data twice (after update): '+$tester.data('test')}));
$('div').append($('<p />', {text: 'Nevertheless the attribute has been updated using attr function in the meantime: '+$tester.attr('data-test')}));
$('div').append($('<p />', {text: 'You have to modify via the data function. $("span").data("test", 2)' + ($("span").data('test', 2), '')}));
$('div').append($('<p />', {text: 'Now, accessing the value via "data function will give you the right value:' + ($tester.data('test'))}));
$('div').append($('<p />', {text: 'So use $element.data once "data" function has been called at least once for the element.'}));
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span data-test="1"></span>
<div></div>
&#13;