Question

我有一个图像链接，我想将其用作切换按钮。

<img id="myToggleButton" src="myToggle.jpg" />

And what I want it to toggle is this:

<ul id="listview" data-filter="true">

So, basically I need to change from data-filter="true" or data-filter="false" and so on.

如何使用JQuery实现此功能？

Answer 1

$('#myToggleButton').click(function(){
   var $listview = $('#listview');
   $listview.attr('data-filter',
       $listview.attr('data-filter')=='false' ? 'true' : 'false'
   );
});

Answer 2

有什么东西？

var $list = $('#listview');
$('#myToggleButton').click(function (event) {
  if($list.data('filter') == true) {
    $list.attr('data-filter', false);
  }else {
    $list.attr('data-filter', true);
  }
});

Answer 3

这是使用data()方法处理数据属性的更简洁和现代的jQuery方式：

$('#myToggleButton').click(function (){
  var listview = $('#listview');
  listview.data('filter', !listview.data('filter'));
  listview.listview('refresh');
});

这里还有JSFiddle，所以你可以看到它的实际效果。

JQuery在数据过滤器上切换为True或False

3 个答案: