jquery autocomplete怎么实现的?

jQuery 自动完成功能非常易于使用。
它有一个名为 autocomplete 的方法，写法如下 autocomplete(urlordata,[options])。

urldata 可以是数组或 url。
例如本地数据是一个数组，[“apple”,“banana”]；远程数据是一个 url，例如“/api/search”。
选择就是选择。
例如：
minChars：用户必须在框出现之前输入一些字符。
默认为 1 如果设置为 0，双击或删除时也会出现。

width：下拉框的宽度，默认与输入框相同。

max：下拉框中显示的条数，默认为1 0
延迟：打字后等待响应多少毫秒，远程为4 00ms，本地为1 0ms。

自动填充：当您单击下拉框中的内容时，它会自动填充输入框。
默认情况下不会填充它。

mustMatch：输入非法字符时不会出现下拉框，默认没有限制。

matchContains：搜索时检查字符串中是否存在匹配项。
例如，“ba”和“foobar”可以匹配，但默认情况下不检查。

选择第一个：按 Tab 或 Enter 时，默认选择第一个。
这是默认设置。

CacheLength：缓存多少结果。
如果设置为 1 ，则不会缓存任何结果。
默认缓存为 1 0 个结果。

matchSubset：是否可以使用缓存结果，默认开启。

MatchCase：区分大小写，默认不区分。

multiple：是否可以多选，默认不允许。

multipleSeparator：用什么来分隔多个选择？默认是逗号。

scroll：当结果较多时使用滚动条。
默认情况下使用它。

scrollHeight：滚动条的高度，默认1 8 0px。

formatItem：自定义下拉框显示的内容，比如添加图标什么的。

formatResult：格式化输入框中显示的值。

formatMatch：用于格式化搜索的值。

extraParams：向后台发送额外参数，如{"user": "admin"}。

结果：单击下拉框中的某些内容后触发的事件。
你可以做点什么。

数据源分为本地和远程。
本地是一个 JSON 数组或对象，例如 ["Apple", "Banana"]。
远程是一个 URL。
后台需要返回特定格式的数据。
使用“\n”换行，使用“|”分隔每行中的字段，例如“Apple\nBanana”。

例如，本地数据的使用方式如下： javascript $("标签").autocomplete(["苹果", "香蕉"], { 宽度：3 2 0， 最大：4 ， multiple: true, //允许多选 滚动：真实， 滚动高度：3 00 });
远程数据的使用方式如下： 接待处： javascript $(文档).ready(函数() { $("登录").autocomplete("/ajax/Account", { formatItem: 函数(行, i, 最大值) { var obj = eval("(" + row + ")"); 返回 obj.Text； } }).结果(函数(事件，项目){ var obj = eval("(" + item + ")"); $("link").attr("href", obj.url); }); });
后端 C MVC： 夏普 公共ContentResult GetUserAccount（字符串q）{ 字符串 strResult = ""; //...查询数据... strResult = "{text:'苹果', url:'/page1 '}\n{text:'香蕉', url:'/page2 '}"; 返回内容（strResult）；
注意远程数据格式一定要正确，用“\n”换行，用“|”来分隔字段。
例如，“苹果\香蕉”。
这样自动完成就可以正确解析它。

Jquery中，$("<option></option>")这个是选择什么？

直接使用 jQuery 创建选项： $("").text("contentA").val("A");
这是一个陷阱：不要在文本和值之间使用引号，否则该值将无法正确分配。

实用提醒：确保代码中的引号使用正确。

jquery multiselect下拉列表复选框动态怎么动态添加option并赋值

当我读到那段代码时，我很困惑。
为什么更新方法不起作用？然后我想，嘿，我改变了主意并尝试了其他事情。
可以看到，$.get方法是从服务器获取数据。
该数据是ajax返回的json数据。
我尝试转换它，它变成了这样的结构：[{label:xxx,value:id}]。
该标签类似于下拉框中显示的文本，其值为所选值。
后来我意识到这个结构是关键，不会错的。
然后我在那里写了一个循环并修改了这样的数据结构。
具体来说，site.push({label:values.site_name, value:values.id});。
过程有点繁琐，但我成功了。

后来我发现如果我在查询数据库的时候直接按照这个方法：从表名中选择id作为值，城市名作为标签，js中的返回值就不需要我烦人的去改变结构了。
可以直接使用：$("site_id").multiselect('dataprovider', data);。
当时我就对自己说，这个方法很方便，不用更新，直接用就可以了。
这样，你就解决了问题。

如何解决jQuery赋值后无法触发下拉框联动的问题？

嘿嘿，我以前也遇到过这种情况，给你讲一下吧。

去年，我正在参与一个连接省市的政府项目。
用户选择一个省份，城市下拉列表会自动更新。
结果，IE浏览器出现问题。

想一想，用户手动选择一个省份，更改事件正常触发，城市下拉列表也会相应变化。
但在IE浏览器控制台中，我使用jQuery直接赋值，例如$('province').val('province')。
嘿嘿，没有答案！城市下拉列表未更新。

查了很久，发现直接改变值并不会触发change事件，所以只好手动模拟一下。
否则，这些链接逻辑将根本不起作用。

我尝试了两种方法：
1 在原生 JS 中模拟的事件。
代码大概是这样的： javascript const select = document.getElementById('省'); const evt = document.createEvent('HTMLEvents'); evt.initEvent('更改', false, true); select.value = '某省份'; //先改变值 select.dispatchEvent(evt);
关键是dispatchEvent步骤，它只是“丢弃”事件。
起初我有点困惑，想知道为什么这么尴尬。
但它有效。

2 jQuery 触发方法。
这更简单： javascript $('省').val('某省').trigger('change');
一行代码。
但请确保 jQuery 已加载。

然后我封装了一个工具函数，方便复用： javascript 函数triggerChange（元素）{ if (document.createEvent) { const evt = document.createEvent('HTMLEvents'); evt.initEvent('更改', false, true); element.dispatchEvent(evt); } else if (element.fireEvent) { element.fireEvent('onchange'); }
如果以后遇到类似的问题，直接使用这个功能就可以了。

测试时，我还专门在IE9 +上进行了尝试，createEvent和dispatchEvent都可以使用。
在 IE8 及更早版本中使用 fireEvent： javascript if (select.fireEvent) { select.fireEvent('onchange'); }其他{ const evt = new Event('change', { bubbles: false, cancelable: true }); select.dispatchEvent(evt);
虽然这是多了一步判断，但总比什么都不做要好。

一般情况下，直接改变下拉列表的值并不会触发该事件。
这是一个古老的陷阱。
可以通过dispatchEvent或者trigger来解决。
在我后来的项目中，我优先使用jQuery的触发器，因为代码简洁，兼容性好。

你试试吧，应该能解决你的问题。