jquery手机搜索没有自动过滤器

我有一个搜索过滤器在我的jquery手机网站。默认情况下，搜索过滤器会自动过滤列表，当我输入搜索关键字。但我需要它过滤列表后按enter键。jquery手机搜索没有自动过滤器

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"> 
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
</head> 
<body> 

<div data-role="page" id="pageone"> 
    <div data-role="main" class="ui-content"> 
    <h2>My Phonebook</h2> 
    <form class="ui-filterable"> 
     <input id="myFilter" data-type="search"> 
    </form> 
    <ul data-role="listview" data-filter="true" data-input="#myFilter" data-autodividers="true" data-inset="true"> 
     <li><a href="#">Adele</a></li> 
     <li><a href="#">Agnes</a></li> 
     <li><a href="#">Albert</a></li> 
     <li><a href="#">Billy</a></li> 
     <li><a href="#">Bob</a></li> 
     <li><a href="#">Calvin</a></li> 
     <li><a href="#">Cameron</a></li> 
     <li><a href="#">Chloe</a></li> 
     <li><a href="#">Christina</a></li> 
     <li><a href="#">Diana</a></li> 
     <li><a href="#">Gabriel</a></li> 
     <li><a href="#">Glen</a></li> 
     <li><a href="#">Ralph</a></li> 
     <li><a href="#">Valarie</a></li> 
    </ul> 
    </div> 
</div> 

</body> 
</html>

来源

2015-05-09 karthick raja

可以由具有自定义代码响应filterablebeforefilter事件和使用的preventDefault有禁用过滤。知道是否取消过滤的方法可能是始终阻止，除非按下Enter键。

var blockNextFilter = true; 

$("#myFilter").keyup(function(e){ 
    // respond to enter key only 
    if (e.keyCode == 13) 
    { 
    blockNextFilter = false; 

    // trigger a change event to force the filter code to trigger 
    $("#myFilter").change(); 
    } 
}); 

$("ul").on("filterablebeforefilter", function(e, data) { 
    // disable auto-filtering 
    if (blockNextFilter) { 
    e.preventDefault(); 
    } 
    // except when we're told so 
    else { 
    blockNextFilter = true; 
    } 
});

JSFiddle here

来源

2015-05-09 06:16:38 Ben

似乎不错......你能告诉我JS提琴演示link..thanks提前.. –

老兄......它的工作fine..thank .....了快速反应...在这之前我正在寻找很多..任何方式谢谢.... –

jquery手机搜索没有自动过滤器

回答

相关问题