更改jQuery mobile中数据筛选器的默认行为
我有一个带有更改jQuery mobile中数据筛选器的默认行为,jquery,listview,jquery-mobile,Jquery,Listview,Jquery Mobile,我有一个带有data filter=“true”属性的无序列表。 当筛选框为空时,如何隐藏列表项? 我应该覆盖默认的列表视图行为吗?怎么做 这实际上是一种解决方法,目的是在每个可折叠块中过滤具有UL的可折叠集。最后我想做的是显示带有隐藏内容的数据过滤器和可折叠集,因此如果用户选择使用过滤器,则应隐藏可折叠集,并且仅显示过滤结果 提前感谢…不幸的是,无法为此覆盖jquery mobile的默认行为。您需要在jquery移动代码之上添加处理。请尝试以下操作: 为此,您需要如下定义样式表: .ui
data filter=“true”
属性的无序列表。
当筛选框为空时,如何隐藏列表项?
我应该覆盖默认的列表视图行为吗?怎么做
这实际上是一种解决方法,目的是在每个可折叠块中过滤具有UL的可折叠集。最后我想做的是显示带有隐藏内容的数据过滤器和可折叠集,因此如果用户选择使用过滤器,则应隐藏可折叠集,并且仅显示过滤结果
提前感谢…不幸的是,无法为此覆盖jquery mobile的默认行为。您需要在jquery移动代码之上添加处理。请尝试以下操作: 为此,您需要如下定义样式表:
.ui-hidden-component {
display: none !important;
}
并添加以下脚本代码:
$(document).delegate('[data-role="page"]', 'pageinit',
function() {
var $listview = $(this).find('[data-role="listview"][data-filter="true"]');
$(this).delegate('input[data-type="search"]', 'keyup change',
function () {
var $this = $(this);
if ($this.val() == '') {
$listview.children().addClass("ui-hidden-component");
} else {
$listview.children().removeClass("ui-hidden-component");
}
});
if ($('input[data-type="search"]').val() == '') {
$listview.children().addClass("ui-hidden-component");
}
});