Question

我需要在数据属性的两个可能值之间切换。

如果data-state等于enabled，那么我想将其更改为disabled，反之亦然。

$('.sites .state').on('ajax:success', function(data, status, xhr) {
   var site = $(this).parents('article').first();

   if (site.data('state') == 'enabled') {
     site.attr('data-state', 'disabled');
   } else {
     site.attr('data-state', 'enabled');
   }
});

注意：我需要更改DOM元素和to my knowledge，我不能使用data来执行此操作（因此使用attr）。

Answer 1

site.attr('data-state', 'disabled');

应该是

site.data('state', 'disabled');

创建元素时，可以使用data-<value>属性初始化data属性，但之后必须使用jQuery.data()方法来获取或修改数据。

$(el).data('<data-name>')返回值时，$(el).data('<data-name>', value)设置数据值。

更新：根据更新的要求

$('div').attr('data-state', $('div').attr('data-state') == 'enabled' ? 'disabled' : 'enabled')

Fiddle

Answer 2

不确定问题是什么，但由于您使用的是.data()，因此您可以继续在if / else中使用它。执行.attr('data-state')会将其保存在DOM元素本身上（当您检查元素时可见），而使用.data('state')则它是不可见的，也更快。

此外，如果你使用三元运算符，你可以将它变成一条小行：

site.attr('data-state', site.data('state') === 'enabled' 
    ? 'disabled' 
    : 'enabled');

Answer 3

site.data('state', (site.data('state') == 'enabled' ? 'disabled' : 'enabled'))

如何使用jQuery切换数据属性？

3 个答案: