简体   繁体   English

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

[英]Uncaught TypeError: $(…).easyAutocomplete is not a function

I am creating a web app using Node js and express. 我正在使用Node js和express创建一个Web应用程序。 For autocomplete I am using a third party node module called easy-autcomplete . 对于自动完成功能,我正在使用名为easy-autcomplete的第三方节点模块。 I have followed the documentation and included all the files however I am getting the following error 我已按照文档进行操作,并包含了所有文件,但是出现以下错误

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 后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 后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.js

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

I checked for various solutions where I had to move my file from the node modules folder however the error persisted. 我检查了各种解决方案,必须将文件从节点模块文件夹中移出,但错误仍然存​​在。

You should move the script and css for easy-autocomplete before your own script. 您应该在自己的脚本之前将脚本和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> 

Then don't forget to include jQuery script as mentionned in the documentation 然后别忘了包含文档中提到的jQuery脚本

You need to load the plugin / library before your custom code, otherwise it won't exist. 您需要在自定义代码之前加载插件/库,否则它将不存在。 jQuery also needs to be included before both of these scripts . 在这两个scripts之前还需要包含jQuery

Try the following: 请尝试以下操作:

<script src="/scripts/jquery.easy-autocomplete.min.js"></script>
<script src="/javascripts/post-property.js"></script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM