基于URL哈希字符串过滤列表

我有一个名为myul的列表（无论如何）

 
item 1
 
item 2
 
item 3
 
item 4
 
item 5
 
item 6
  

我使用过滤其项目

和脚本基于jquery

     jQuery.expr ['：']。containsLower = function（a，i，m）{
       return jQuery（a）.text（）。toUpperCase（）
          .indexOf（m [3] .toUpperCase（））> = 0;  //用于大写 - 小写支持
     };

     $（ '＃filter'）。KEYUP（函数（）{
       $（'ul #myul li'）。hide（）。filter（'：containsLower（“'+ this.value +'”）'）。fadeIn（）; 

     //仅显示具有输入值的项目以及键盘function上的项目
     }）;

它可以过滤关键function列表，但我希望它也可以在字符串上工作是URL哈希，所以我使用

     $（window）.load（function（）{
         var hash = window.location.hash.substring（1）;  //删除＃
         document.getElementById（'filter'）。value = hash;  //添加哈希字符串以过滤输入
     }）;

但它不会过滤列表（考虑到url已经存在的哈希），即使我在窗口加载（而不是keyup）上运行filterfunction。 它只是隐藏所有列表项。 我想让它在窗口加载，而不是键盘上工作..

有任何想法吗？

Answer 1

仅仅设置文本框的值不会做任何事情。 您需要触发函数binder到keyup 。

 $(window).load(function () { var hash = window.location.hash.substring(1); // removes the # document.getElementById('filter').value = hash; // adds hash string to filter input $('#filter').trigger('keyup'); // trigger a keyup manually }); 

或者你可以创建一个接受搜索键的通用函数，并在keyup和window load上用相应的值调用它。 就像是

 jQuery.expr[':'].containsLower = function(a, i, m) { return jQuery(a).text().toUpperCase() .indexOf(m[3].toUpperCase()) >= 0; // for uppercase-lowercase support }; function displayMatches(value){ $('ul#myul li').hide().filter(':containsLower("'+value+'")').fadeIn(); } $('#filter').keyup(function(){ displayMatches(this.value) }) $(window).load(function () { var hash = window.location.hash.substring(1); // removes the # displayMatches(hash) });