【问题标题】:Need help with implementation of the jQuery LiveUpdate routine在实施 jQuery LiveUpdate 例程方面需要帮助
【发布时间】:2011-02-13 15:19:28
【问题描述】:

是否有人使用过 this page 上的 LiveUpdate 功能(可能有点用词不当)?它并不是真正的实时搜索/更新功能,而是基于您在文本字段中输入的模式对预先存在的列表进行快速过滤的机制。

为了方便参考,我将整个函数粘贴在这里:

jQuery.fn.liveUpdate = function(list){
  list = jQuery(list);

  if ( list.length ) {
    var rows = list.children('li'),
      cache = rows.map(function(){
        return this.innerHTML.toLowerCase();
      });

    this
      .keyup(filter).keyup()
      .parents('form').submit(function(){
        return false;
      });
  }

  return this;

  function filter(){
    var term = jQuery.trim( jQuery(this).val().toLowerCase() ), scores = [];

    if ( !term ) {
      rows.show();
    } else {
      rows.hide();

      cache.each(function(i){
        var score = this.score(term);
        if (score > 0) { scores.push([score, i]); }
      });

      jQuery.each(scores.sort(function(a, b){return b[0] - a[0];}), function(){
        jQuery(rows[ this[1] ]).show();
      });
    }
  }
};

我有这个列表,ID 为 members。还有一个以 qs 作为 ID 的文本字段。

我尝试通过以下方式绑定函数:

$( '#qs' ).liveUpdate( '#members' );

但是当我这样做时,该函数在页面加载时仅调用一次(我在函数中放入了一些 console.logs),但在将文本键入文本字段后从未调用.我还尝试从 qskeyup() 函数调用例程。

$( '#qs' ).keyup( function() {
    $( this ).liveUpdate( '#members' );
});

这最终会进入无限循环(几乎)并因 “递归过多” 错误而停止。

那么任何人都可以阐明我应该如何实际实现此功能吗?

另外,当你在做的时候,有人可以向我解释一下这行吗:

var score = this.score(term);

我想知道的是这个成员方法score()是从哪里来的?我没有找到任何内置在 JS 或 jQuery 中的此类方法。

感谢大家的帮助, m^e

【问题讨论】:

    标签: jquery search list filter live


    【解决方案1】:

    score() 来自Quicksilver library。这在 post 中不是很清楚,但 John 在 cmets 中回答了相同的问题。

    【讨论】:

      最近更新 更多