如何在列表视图中清除或重置搜索过滤条?

时间:2013-04-14 02:59:42

标签: jquery jquery-mobile filtering jquery-mobile-listview jquery-mobile-fieldset

我搜索了这个问题的答案的高低。我有一个使用listview搜索过滤器的应用程序。但是,当用户离开页面时,搜索过滤器“记住”先前的搜索。

我的问题:当用户离开页面时,如何重置搜索过滤器?下次打开页面时,我希望清除搜索过滤器,以便再次显示整个列表并且之前的搜索被“遗忘”了?

3 个答案:

答案 0 :(得分:4)

首先你需要像这样清空它:

$('input[data-type="search"]').val("");
$('input[data-type="search"]').trigger("keyup");

使用jsFiddle示例:http://jsfiddle.net/Gajotres/fEV3J/

HTML:

<div data-role="content">
    <div data-role="fieldcontain">    
        <ul data-role="listview" data-filter="true">
            <li><a href=#>Cat</a></li>
            <li><a href=#>Dog</a></li>
            <li><a href=#>Mouse</a></li>
        </ul>
    </div>
    <div data-role="fieldcontain">       
       <input type="button" value="Clear" id="clear-filter"/>
    </div>
</div>

JS:

$(document).on('click', '#clear-filter', function(){       
    $('input[data-type="search"]').val('');
    $('input[data-type="search"]').trigger("keyup");
});

答案 1 :(得分:1)

删除输入值,触发keyup事件以撤消上一个过滤器,并(如果需要)将光标聚焦在新搜索上。

$(document).ready(function () {
    $('#input-filter').val('').trigger('keyup').focus();
});

答案 2 :(得分:0)

你可能想试试这个:

$('a[data-icon="delete"]').trigger('click');

另外,您可能希望预先添加您可能喜欢的任何表单

$('#myForm a[data-icon="delete"]').trigger('click');