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

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

<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.

我想让它切换的是：

因此，基本上我需要从data filter=“true”或data filter=“false”等更改。

---

我如何使用JQuery实现这一点？

类似的东西

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

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

---

一些类似的东西

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

---

下面是一种更简洁、更现代的jQuery方法，它使用

data（）

方法来处理数据属性：

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

---

这里还有一个示例，您可以看到它的作用。

这里有一个更简洁、更现代的jQuery方法，使用

data（）

方法处理数据属性：

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

---

这里还有一个标记，您可以看到它的作用。

您是否将此标记与jQuery Mobile listview小部件一起使用？在这种情况下，在设置

数据过滤器

属性后，您可能必须刷新小部件（

$（“#listview”）.listview（“刷新”）

）。您是否将此标记用于jQuery Mobile listview小部件？在这种情况下，在设置

数据过滤器

属性之后，您可能必须刷新小部件（

$（“#listview”）.listview（“刷新”）

），而

数据（）的setter表单不创建或更新
数据-
属性，即使它的getter表单在没有任何与数据缓存中的元素相关联的情况下读取它们。啊，我的错。我应该知道这一点，因为我最近遇到了这个问题，它应该能够设置它们，这在我的头脑中是有道理的。
data（）
的setter形式不会创建或更新
data-
属性，即使它的getter形式在没有与数据缓存中的元素关联的情况下读取它们。啊，我的错。我应该知道这一点，因为我最近遇到了这个问题，它应该能够设置它们，这在我的头脑中是合乎逻辑的

你会看到

data（）

实际上没有修改

data filter

属性。他提供的HTML中已经设置了

data filter

，你不需要使用jQuery或JavaScript来设置它。啊，很抱歉，我误解了你一开始说的话，我明白你现在说的话，但我不确定这有多重要。如果更新HTML元素也很重要，那么您认为jQuery会包括这一点。我想这取决于您如何解释问题，以及发问者使用的库：）尽管（例如）jQuery Mobile使用

data（）

获取

数据过滤器

属性的值，因此，您可以安全地使用

data（）

进行设置，其他代码也可以查询属性本身你会看到

data（）

实际上没有修改

data filter

属性。他提供的HTML中已经设置了

data filter

，你不需要使用jQuery或JavaScript来设置它。啊，很抱歉，我误解了你一开始说的话，我明白你现在说的话，但我不确定这有多重要。如果更新HTML元素也很重要，那么您认为jQuery会包括这一点。我想这取决于您如何解释问题，以及发问者使用的库：）尽管（例如）jQuery Mobile使用

data（）

获取

数据过滤器

属性的值，因此，您可以安全地使用

data（）

来设置它，其他代码也可以查询属性本身。简化

$listview.attr（'data-filter'）=='false'？'true'：'false'

至

！JSON.parse（$listview.attr（'data-filter'））

简化

$listview.attr（'data-filter'）=='false'？'true'：'false'

至

！JSON.parse（$listview.attr（'data-filter'））