jQuery对我来说很难理解。每次不得不使用它时,我都会花数小时阅读文档,却一无所获。我正在使用此代码(可以进行实时编辑)。
http://codepen.io/anon/pen/vKFBy
它在键入输入文本时实时过滤记录。问题是我不想要它的搜索方法。让我解释。
<ul id="list">
<li class="in"><span>google.com</span></li>
<li class="in"><span>gmail.com</span></li>
<li class="in"><span>samsung.com</span></li>
<li class="in"><span>amazon.de</span></li>
<li class="in"><span>apple.de</span></li>
</ul>
当我输入“ G”或“ g”(不区分大小写)时,amazon.de和apple.de消失了,因为它们不包含任何“ G”,同时google.com gmail.com和samsung.com仍然可见。这就是问题。我不想让萨姆松摹.COM只是因为在某些时候它有一个“G”。我只想返回span以某个字符串开头的元素。用实际的话来说,这就是我要复制的东西。
我输入“ G”:
<ul id="list">
<li class="in"><span>google.com</span></li>
<li class="in"><span>gmail.com</span></li>
<li class="hiding out hidden"><span>samsung.com</span></li>
<li class="hiding out hidden"><span>amazon.de</span></li>
<li class="hiding out hidden"><span>apple.de</span></li>
</ul>
我一直在输入“ Go”:
<ul id="list">
<li class="in"><span>google.com</span></li>
<li class="hiding out hidden"><span>gmail.com</span></li>
<li class="hiding out hidden"><span>samsung.com</span></li>
<li class="hiding out hidden"><span>amazon.de</span></li>
<li class="hiding out hidden"><span>apple.de</span></li>
</ul>
我知道我应该使用的语法:
indexOf(searchTerm)
或者:
[span^="'+searchTerm+'"]
或者:
str.match(/^searchTerm/)
但是我无法编辑当前的if语句。每次我破坏脚本。
创建一个新的:startswith
自定义选择器(或者:startswithi
如果您需要特定的话),并检查indexOf
匹配项中的位置0 :
http://jsfiddle.net/TrueBlueAussie/z148kzeo/
//extends :contains to be case insensitive
$.extend($.expr[':'], {
'startswith': function (elem, i, match, array) {
return (elem.textContent || elem.innerText || '').toLowerCase()
.indexOf((match[3] || "").toLowerCase()) == 0;
}
});
请注意,您正在将您的自定义选择器添加到keyup
处理程序事件中(每次键入键时)。我将其移动到开始。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句