インターネットから取得して目的に合わせて変更したjqueryフィルター関数にはほとんど問題がありません。
そしてここにコードがあります:
(function ($) {
// custom css expression for a case-insensitive contains()
jQuery.expr[':'].Contains = function(a,i,m){
return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;
};
function listFilter(header, list) { // header is any element, list is an unordered list
// create and add the filter form to the header
var form = $("<form>").attr({"class":"filterform","action":"#"}),
input = $("<input>").attr({"class":"filterinput","type":"text", "value":"Live-Filterfunktion"});
$(form).append(input).appendTo(header);
$(input)
.change( function () {
var filter = $(this).val().replace(/\s+/g, '').toLowerCase();
$('.serien a').each(function(i, el){
text = $(el).text().replace(/\s+/g, '').toLowerCase();
index = text.indexOf(filter);
if(index != -1){
// The substring is contained -> show parent
//console.log($(this).attr('id')+' contains '+filter);
//$(this).find("a:Contains(" + filter + ")").parent().fadeIn();
$(this).parent().show();
}else{
// The substring is not contained -> hide parent
//console.log($(this).attr('id')+' does not contain '+filter);
//$(this).find("a:not(:Contains(" + filter + "))").parent().fadeOut();
$(this).parent().hide();
}
});
return false;
})
.keyup( function () {
// fire the above change event after every letter
$(this).change();
});
}
//ondomready
$(function () {
listFilter($(".filter"), $(".list"));
});
$(function() {
$(".filterinput").focus(function() {
$(this).val('')
$(this).change();
});
});
}(jQuery));
フィルタはうまく機能し、空白を無視することもできます。しかし、私には修正できない問題が1つあります。フィルタの一致は、検索キーワードが連続している場合にのみ機能します。
入力フィールドに「JohnWayne」または「johnwayne」と入力すると、正常に機能します。しかし、ここで「John Tayler」と入力すると、検索キーワードが連続していないために機能しませんでしたが、リストには両方のキーワードが含まれています。試してみましたが、うまくいきません。
だから私はここでいくつかの助けを得ることができると思います、それは素晴らしいことです。ポーランドから来た私の悪い英語のイムに申し訳ありません。
ご挨拶!