JavaScript提前键入自动完成匹配重音和波浪号问题_Javascript_Jquery_Utf 8_Autocomplete_Typeahead.js

JavaScript提前键入自动完成匹配重音和波浪号问题

javascript jquery utf-8 autocomplete

JavaScript提前键入自动完成匹配重音和波浪号问题,javascript,jquery,utf-8,autocomplete,typeahead.js,Javascript,Jquery,Utf 8,Autocomplete,Typeahead.js,我使用的是jQuery库，但当用户键入类似e的人声时，它也应该匹配外国人声，如é，ë，è 也将n与ñ匹配这是我的代码： <html> <head> <meta charset="utf-8"> <link rel="stylesheet" href="typeahead.css"> <script src="jquery-1.11.0.min.js

我使用的是jQuery库，但当用户键入类似

的人声时，它也应该匹配外国人声，如

é

，

ë

，

è

也将

与

ñ

匹配

这是我的代码：

<html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="typeahead.css">
    <script src="jquery-1.11.0.min.js"></script>
    <script src="typeahead.bundle.min.js"></script>
</head>
<body>
    <center>
        <div id="nombre">
            <input class="typeahead" type="text" placeholder="Nombre">
        </div>
    </center>
    <script>
        var charMap = {
            "à": "a", 
            "á": "a", 
            "ä": "a", 
            "è": "e", 
            "é": "e", 
            "ë": "e", 
            "ì": "i", 
            "í": "i",
            "ï": "i",
            "ò": "o",
            "ó": "o",
            "ö": "o",
            "ù": "u",
            "ú": "u",
            "ü": "u",
            "ñ": "n"};
        var normalize = function (input) {
            $.each(charMap, function (unnormalizedChar, normalizedChar) {
                var regex = new RegExp(unnormalizedChar, 'gi');
                input = input.replace(regex, normalizedChar);
            });
            return input;
        }
        var substringMatcher = function(strs) {
        return function findMatches(q, cb) {
            var matches, substringRegex;
            matches = [];
            substrRegex = new RegExp(q, "i");
            $.each(strs, function(i, str) {
              if (substrRegex.test(str)) {
                matches.push({ value: str });
              }
            });
            cb(matches);
          };
        };
        var nombres = ["Sánchez", "Árbol", "Müller", "Ératio", "Niño"];
        $("#nombre .typeahead").typeahead({
          hint: true,
          highlight: true,
          minLength: 1
        },
        {
          name: "nombres",
          displayKey: "value",
          source: substringMatcher(nombres)
        });
    </script>
</body>


var charMap={
“a”：“a”，
“a”：“a”，
“a”：“a”，
“è”：“e”，
“e”：“e”，
“ë”：“e”，
ì:“我”，
“i”：“i”，
“我”：“我”，
“ò”：“o”，
“o”：“o”，
“o”：“o”，
“ù”：“u”，
“u”：“u”，
“u”：“u”，
“ñ”：“n”}；
变量规格化=函数（输入）{
$.each（charMap，函数（unnormalizedChar，normalizedChar）{
var regex=新的RegExp（unnormalizedChar，'gi'）；
input=input.replace（regex，normalizedChar）；
});
返回输入；
}
var substringMatcher=函数（strs）{
返回函数findMatches（q，cb）{
var匹配，substringRegex；
匹配项=[]；
substregex=新的RegExp（q，“i”）；
$。每个（str，功能（i，str）{
if（子相关性测试（str））{
匹配.push（{value:str}）；
}
});
cb（比赛）；
};
};
var nombres=[“桑切斯”、“阿尔波尔”、“穆勒”、“埃比”、“尼诺”]；
$（“#nombre.typeahead”）.typeahead({
提示：没错，
推荐理由：没错，
最小长度：1
},
{
名称：“nombres”，
显示键：“值”，
来源：子字符串匹配器（nombres）
});

我怎样才能做到这一点

谢谢

我在下面的jsFiddle中编写了一个解决方案：

解决方案的关键部分是规范用于搜索的名称，并包括用于显示的原始名称；您可以在下面“本地”的定义中看到这一点：

normailze函数（如下所示）将“外来”字符替换为西方可选字符：

var normalize = function (input) {
    $.each(charMap, function (unnormalizedChar, normalizedChar) {
        var regex = new RegExp(unnormalizedChar, 'gi');
        input = input.replace(regex, normalizedChar);
    });
    return input;
};

为了简洁起见，我省略了charMap（它决定了外来字符映射到哪个西方字符）；你可以在小提琴上找到列表。

在这里看到答案@Fresh，你能重新检查我的问题吗？我添加了更多的代码。谢谢TypeError:input.replace不是函数input=input.replace（regex，normalizedChar）；我有个问题，我用打字机。0.10.0因为会干扰0.10.0版本的较新版本，所以问题是当我“点击”某个建议时，它不会在输入时自动完成。不幸的是，typeahead 0.10.0版本中的脚本导致我出现以下错误：

Uncaught TypeError:无法调用未定义的方法“whitespace”：（你知道如何解决这个问题吗？如果你在fiddle中遵循我的示例，请确保在网站中引用typeahead.js包（这包括typeahead和警犬建议引擎）。还要确保“local”函数正在用“value”传回对象键值对。现在我使用typeahead.bundle.js，但当点击一个建议时，该建议不会在输入中自动完成。我如何调整它？：由于您想要调整的功能与此问题没有真正的关系，您应该创建一个新问题。
var normalize = function (input) {
    $.each(charMap, function (unnormalizedChar, normalizedChar) {
        var regex = new RegExp(unnormalizedChar, 'gi');
        input = input.replace(regex, normalizedChar);
    });
    return input;
};