在輸入字段上過濾土耳其字符

Question

如何在輸入普通字符時過濾土耳其字符？ 當我想要過濾名稱'GülayGül'時，它不會在我輸入Gul時出現..等等。是否可以繞過jQuery？

var item = $('.item'); 
 
    $('input').keyup(function() { 
 
    var valThis = $(this).val().toLowerCase(); 
 
    if (valThis == '') { 
 
     $(item).show(); 
 
    } else { 
 
     $(item).each(function() { 
 
     var text = $(this).text().toLowerCase(); 
 
     var match = text.indexOf(valThis); 
 
     if (match >= 0) { 
 
      $(this).show(); 
 
     } else { 
 
      $(this).hide(); 
 
     } 
 
     }); 
 
    }; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" placeholder="Search"> 
 
<div class="item"> 
 
    <h3>John walker</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Michael Mayer</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Tim Jones</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Gülay Gül</h3> 
 
</div>

Answer 1

什麼你正在尋找基於this這裏被稱爲accent folding.是我的解決方案，更新你的腳本：

var item = $('.item'); 
 
    $('input').keyup(function() { 
 
    var valThis = $(this).val().toLowerCase(); 
 
    if (valThis == '') { 
 
     $(item).show(); 
 
    } else { 
 
     $(item).each(function() { 
 
     var text = accentsTidy($(this).text().toLowerCase()); 
 
     var match = text.indexOf(valThis); 
 
     if (match >= 0) { 
 
      $(this).show(); 
 
     } else { 
 
      $(this).hide(); 
 
     } 
 
     }); 
 
    }; 
 
    }); 
 
    
 
    accentsTidy = function(s) { 
 
    var map = [ 
 
     ["\\s", ""], 
 
     ["[àáâãäå]", "a"], 
 
     ["æ", "ae"], 
 
     ["ç", "c"], 
 
     ["[èéêë]", "e"], 
 
     ["[ìíîï]", "i"], 
 
     ["ñ", "n"], 
 
     ["[òóôõö]", "o"], 
 
     ["œ", "oe"], 
 
     ["[ùúûü]", "u"], 
 
     ["[ýÿ]", "y"], 
 
     ["\\W", ""] 
 
    ]; 
 
    for (var i=0; i<map.length; ++i) { 
 
     s = s.replace(new RegExp(map[i][0], "gi"), function(match) { 
 
      if (match.toUpperCase() === match) { 
 
       return map[i][1].toUpperCase(); 
 
      } else { 
 
       return map[i][1]; 
 
      } 
 
     }); 
 
    } 
 
    return s; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" placeholder="Search"> 
 
<div class="item"> 
 
    <h3>John walker</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Michael Mayer</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Tim Jones</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Gülay Gül</h3> 
 
</div>

Answer 2

隨着更換Turkish CHARAC用English字符你可以繞過這個。使用regex過濾土耳其語單詞並用英語替換它們，實際上它在比較之前替換文本。

// search filter 
 
    var item = $('.item'); 
 
    var Turkish = { 
 
     Ç: 'C', 
 
     Ö: 'O', 
 
     Ş: 'S', 
 
     İ: 'I', 
 
     I: 'i', 
 
     Ü: 'U', 
 
     Ğ: 'G', 
 
     ç: 'c', 
 
     ö: 'o', 
 
     ş: 's', 
 
     ı: 'i', 
 
     ü: 'u', 
 
     ğ: 'g' 
 
    }; 
 

 

 
    $('input').keyup(function() { 
 
    var valThis = $(this).val().toLowerCase(); 
 
    if (valThis == '') { 
 
     $(item).show(); 
 
    } else { 
 
     $(item).each(function() { 
 
     var text = $(this).text().toLowerCase(); 
 
     
 
var clearTr = text.replace(/Ü|Ç|Ö|Ş|İ|I|Ğ|ç|ö|ş|ı|ü|ğ/gi, function(matched){ 
 
    return Turkish[matched]; 
 
}); 
 
     var match = clearTr.indexOf(valThis); 
 
     if (match >= 0) { 
 
      $(this).show(); 
 
     } else { 
 
      $(this).hide(); 
 
     } 
 
     }); 
 
    }; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" placeholder="Search"> 
 
<div class="item"> 
 
    <h3>John walker</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Michael Mayer</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Tim Jones</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Gülay Gül</h3> 
 
</div> 
 
<div class="item"> 
 
    <h3>Derya Uluğ</h3> 
 
</div>