IT虾米网

javascript之基本 EasyComplete 输入错误

xing901022 2024年11月01日 程序员 51 0

尝试将 EasyComplete 插件(版本 1.3.5)包含到我 future 的网站中,我用最简单的输入标签(“基本”标签)对其进行了测试,但没有成功......我没有看到任何自动完成列表在我的输入标签中输入字母时。

这是我的 html 文件:

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="stylesheet" href="./EasyAutocomplete/easy-autocomplete.min.css">  
    <link rel="stylesheet" href="./EasyAutocomplete/easy-autocomplete.themes.min.css"> 
    <script src="./EasyAutocomplete/jquery.easy-autocomplete.min.js"></script>  
    <script src="//code.jquery.com/jquery-1.11.2.min.js"></script> 
</head> 
<body> 
    <input id="basics" /> 
    <script> 
        $(document).ready(function() { 
            var options = { 
                data: ["blue", "green", "pink", "red", "yellow"] 
                }; 
            $("#basics").easyAutocomplete(options); 
        }); 
    </script> 
</body> 
</html> 

我注意到,使用 Safari Web Inspector,我的页面有 2 个问题:
_ 1 来自 html 文件: '$("#basics").easyAutocomplete(options);不是一个函数'
_ 1 来自 jquery.easy-autocomplete.min.js 文件:“找不到变量 jQuery”(最后一行)

有人可以解释一下我在这个非常基本的例子中做错了什么吗?

请您参考如下方法:

您的 JavaScript 包含内容顺序错误。您需要首先包含 jQuery,然后包含自动完成内容。

这是代码的演示,其中包含的内容按正确的顺序排列:

$(document).ready(function() { 
   var options = { 
     data: ["blue", "green", "pink", "red", "yellow"] 
   }; 
   $("#basics").easyAutocomplete(options); 
 });
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/easy-autocomplete/1.3.5/easy-autocomplete.min.css"> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/easy-autocomplete/1.3.5/easy-autocomplete.themes.css"> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/easy-autocomplete/1.3.5/jquery.easy-autocomplete.min.js"></script> 
 
<input id="basics">


评论关闭
IT虾米网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!