如何将 jquery 自动完成附加到输入元素
Posted
技术标签:
【中文标题】如何将 jquery 自动完成附加到输入元素【英文标题】：How to attach a jquery autocomplete to input element 【发布时间】：2020-05-28 09:29:49 【问题描述】：我想将自动完成附加到 jquery 输入元素。我从这个链接enter link description here 下载了 jquery 小部件 v1.12.1（仅自动完成）。
function maintest ()
let table;
let row1;
let row2;
let cell0;
let cell1;
let header2;
let autocomplete1;
table = $('<table>');
table.attr("id":"testtable");
row1 = $('<tr>');
table.append(row1);
header2 = $('<th>').text("Feature/Description");
row1.append(header2);
row2 = $('<tr>');
table.append(row2);
cell1 = $('<td>');
row2.append(cell1);
autocomplete1 = $("<input>").attr("id" : "selector0");
/*$("#selector0").autocomplete( "option", "source", [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ] );
cell1.append(autocomplete1);*/
$("#mainDiv").append(table);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<body onload="maintest()">
<div id="mainDiv"></div>
</body>注意：我已经评论了自动完成，因为我没有找到合适的 cdn 来包含用于自动完成的 jquery 小部件
我的要求是为输入框添加自动完成功能
【问题讨论】：
您在运行提供的代码时遇到了什么错误？ 我已经下载并安装了 jquery UI 库，我没有看到任何自动完成发生 我不知道如何在代码 sn-p 中附加 jquery-ui 库 您是否尝试过附加所有元素，然后添加自动完成功能？ 【参考方案1】：看起来您需要在调用选项之前添加自动完成功能。这是一个可用的 CodePen 版本：https://codepen.io/edlucas/pen/mdJejqo
function maintest ()
let table;
let row1;
let row2;
let cell0;
let cell1;
let header2;
let autocomplete1;
table = $('<table>');
table.attr("id":"testtable");
row1 = $('<tr>');
table.append(row1);
header2 = $('<th>').text("Feature/Description");
row1.append(header2);
row2 = $('<tr>');
table.append(row2);
cell1 = $('<td>');
row2.append(cell1);
autocomplete1 = $("<input>").attr("id" : "selector0");
cell1.append(autocomplete1);
$("#mainDiv").append(table);
$("#selector0").autocomplete();
$("#selector0").autocomplete( "option", "source", [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ] );
【讨论】：
以上是关于如何将 jquery 自动完成附加到输入元素的主要内容，如果未能解决你的问题，请参考以下文章