javascript - 未捕获的 TypeError : $(. ..).easyAutocomplete 不是函数

标签 javascript jquery easyautocomplete

我正在使用 Node js 和 Express 创建一个 Web 应用程序。对于自动完成,我使用名为 easy-autcomplete 的第三方节点模块。 。我已遵循文档并包含所有文件,但出现以下错误

Uncaught TypeError: $(...).easyAutocomplete is not a function
    at HTMLDocument.<anonymous> (post-property.js:289)
    at mightThrow (jquery-3.3.1.js:3534)
    at process (jquery-3.3.1.js:3602)

post-property.js

$(function(){

    let countries = [
        {"name": "Afghanistan", "code": "AF"},
        {"name": "Albania", "code": "AL"},
        {"name": "Algeria", "code": "DZ"},
..
..
    ]
    var options = {
        data: countries,

        getValue: "name",

        list: {
            match: {
                enabled: true
            }
        }
    };
    $("#provider-json").easyAutocomplete(options);

});

post-property.hbs

<div class="row">
    ..
    ..
</div>
<script src="/javascripts/post-property.js"></script>

<script src="/scripts/jquery.easy-autocomplete.min.js"></script>
<link rel="stylesheet" href="/scripts/easy-autocomplete.css">
<link rel="stylesheet" href="/scripts/easy-autocomplete.themes.min.css">

app.js

...
app.use('/scripts', express.static(__dirname + '/node_modules/easy-autocomplete/dist/'));
...

我检查了各种解决方案,在这些解决方案中,我必须从节点模块文件夹中移动文件,但错误仍然存​​在。

最佳答案

您应该将脚本和 CSS 移动到您自己的脚本之前,以便轻松自动完成。

let countries = [
    {"name": "Afghanistan", "code": "AF"},
    {"name": "Albania", "code": "AL"},
    {"name": "Algeria", "code": "DZ"},
]
var options = {
    data: countries,

    getValue: "name",

    list: {
        match: {
            enabled: true
        }
    }
};
$("#basics").easyAutocomplete(options);
<head>
  <link rel="stylesheet" href="/scripts/easy-autocomplete.css">
  <link rel="stylesheet" href="/scripts/easy-autocomplete.themes.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/easy-autocomplete/1.3.5/jquery.easy-autocomplete.min.js"></script>
  <script src="/javascripts/post-property.js"></script>
</head>
<body>
  <div class="row">
      <input id="basics" />
  </div> 
</body>

然后不要忘记包含文档中提到的 jQuery 脚本

关于javascript - 未捕获的 TypeError : $(. ..).easyAutocomplete 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52640996/

相关文章:

javascript - Web Components(原生 UI)之间如何通信?

javascript - 带扩展的 jQuery 插件不接受用户参数

javascript - 更改 Bootstrap 的默认数据加载文本

javascript - 在新选项卡上打开链接不适用于 IE7-8 和 safari 所有版本?

javascript - easyautocomplete 基本搜索

javascript - 在这种情况下如何使变量全局可访问?

Javascript 需要正则表达式来添加到字符串的末尾

php - php、jquery、mysql的知识库文章创建机制

javascript - 仅当光标在输入中时如何显示 easyautocomplete 对话框

css - 输入组插件中easyAutocomplete插件的宽度覆盖