jQuery更改多个文本字符串以删除所有重音符号

时间:2017-02-10 18:41:11

标签: javascript jquery

我想通过关键字匹配排序大约50个隐藏的div。为了简化示例,我目前只展示了两个。该脚本非常适合英语,但是当您对某些单词进行本地化时,它们可以包含重音符,这会破坏脚本查找匹配结果的能力。示例:在西班牙语中键入telefono与teléfono不匹配。我看到从一个字符串中删除重音的示例,但是如何从所有字符串中删除它们?

<form action="" class="styled" id="live-search" method="post">
    <fieldset>

      <p style="padding-left: 10px; padding-top: 5px;">Start typing to filter.</p>
      <input class="text-input" id="filter" style="margin-top: -60px;" type="text" value="" />  
      <div id="filter-count"></div>
    </fieldset>
</form>

<div>
<p class="listheaders"><strong>Phones:</strong></p>
  <ul class="vglist">
    <li class="listitems"><a href="/en/node/38871" target="_blank">Téléphone Android Nexus 5x<br />
    <img src="someImagePathEtc" width="100" /> </a> <span style="display: none;">teléfono phone nexus 5x</span></li>
    <li class="listitems"><a href="/en/node/33302" target="_blank">Einlösen von Geschenkkarten<br />
    <img src="someImagePathEtc" width="100" /></a> <span style="display: none;">gift cards</span></li>
  </ul>
</div>

<script>
$(document).ready(function(){
    $("#filter").keyup(function(){

        // Retrieve the input field text and reset the count to zero
        var filter = $(this).val(), count = 0;

        // Loop through the visual guide list
        $(".vglist li").each(function(){

            // If the list item does not contain the text phrase fade it out
            if ($(this).text().search(new RegExp(filter, "i")) < 0) {
                $(this).fadeOut("slow");

            // Show the list item if the phrase matches and increase the count by 1
            } else {
                $(this).show();
                count++;
            }
        });

        // Update the count
        var numberItems = count;
        $("#filter-count").html("&nbsp;&nbsp;&nbsp;Number of Guides: "+count);
    });
});
</script>

我需要更新以下小提琴,以便它匹配使用无重音符号键入的字符。谢谢

https://jsfiddle.net/jeremyperson/kp2nmm31/

1 个答案:

答案 0 :(得分:0)

以下是我最后使用的内容,如果它可以帮助将来的任何人。

$(document).ready(function(){
    $("#filter").keyup(function(){

        // Retrieve the input field text

// replace each of the English vowels with all the accentuated equivalents, including the plain English version.
        var filter = $(this).val().replace(/a/g,'[áaàäâ]')
                                               .replace(/e/g,'[éeèëê]')
                                               .replace(/i/g,'[íiìïî]')
                                               .replace(/o/g,'[óoòöô]')
                                               .replace(/u/g,'[úuùüû]')
                                               .replace(/n/g,'[ñn]')
                                               ;
        // reset the count to zero
         var count = 0;

        // Loop through the visual guide list
        $(".vglist li").each(function(){

            // If the list item does not contain the text phrase fade it out
            if ($(this).text().search(new RegExp(filter, "i")) < 0) {
                $(this).fadeOut("slow");

            // Show the list item if the phrase matches and increase the count by 1
            } else {
                $(this).show();
                count++;
            }
        });

        // Update the count
        var numberItems = count;
        $("#filter-count").html("&nbsp;&nbsp;&nbsp;Number of Guides: "+count);
    });
});

https://jsfiddle.net/kp2nmm31/2/