jquery ui 自动完成 id 和关闭事件 ui 参数
我正在使用 jQuery Ui Autocomplete 1.8.14,我想做两件事:
为自动完成分配一个 id。例如,我可能在页面上有许多自动完成功能,我需要一种方法来识别每个自动完成功能。特别是,在后台自动完成功能会生成类似“
<ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" role="listbox" aria-activedescendant="ui-active-menuitem" style="z-index: 1; top: 444px; left: 48px; display: block; width: 118px;">
我想要将 id 分配给 ul
” 标记的内容。我想这样做的原因如下......
希望我说得相当清楚。
编辑:显然,我还不够清楚:)。希望以下内容有助于澄清我的意思: 从自动完成中选择一个项目后,我使用 select 事件通过“ui”参数填充其他表单元素。这一切都很好。
但是,现在我想做的是这样的,比如说在自动完成中我写出自动完成中存在的一个项目。但是,我没有选择该项目,而是使用 Tab 键切换到下一个表单元素。我想要发生的是检查自动完成中输入的术语,循环浏览自动完成列表。如果输入的术语与列表中的一项匹配,我只需从“附加对象”中获取数据,然后相应地填充表单元素。
I am using jQuery Ui Autocomplete 1.8.14 and I would like to do two things:
Assign an id to the autocomplete. For instance, I might have many autocompletes on page and I'd need a way to identify each. In particular, in the background autocomplete is generating something like
<ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" role="listbox" aria-activedescendant="ui-active-menuitem" style="z-index: 1; top: 444px; left: 48px; display: block; width: 118px;">
What I would like is to assign and id to the ul
tag. The reason why I want to do this is for the following reason…
There is a close event and one of the parameters is ui
. In the "select" even this ui
is populated with data that is used to create the autocomplete but for the close event, ui
is empty. That's why I would like to have an id on the ul
tag in my previous question. If I can get the ui
data then I don't need to bother with setting the id although I would think that it's a desirable feature regardless.
Hope I was reasonably clear.
EDIT: Apparently, I wasn't clear enough :). Hopefully, the following will help clarify what I mean:
After an item is selected from the autocomplete, I am using the select event to populate other form elements using the "ui" parameter. That's working all fine and great.
However, now what I want to do is this, say in the autocomplete I write out an item which exists in the autocomplete. However, I don't select the item but instead tab to the next form element. What I would like to happen is to check the term entered in the autocomplete, loop through the autocomplete list. If the term entered matches one of the items in the list, I just get the data out of the "object attached" and then populate the form elements accordingly.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
这是一个演示,我认为它可以满足您的需求。我怀疑有更好的方法可以做到这一点。我确实接受了有关 TAB 的问题部分,并将一个事件绑定到该键。注意:我刚刚看到您对该问题的评论,因此将看看该演示现在好了。因此,在我的演示中,JSON 数据采用不同的格式,因此可能需要进行一些调整。
哦,我刚刚找到了一个现有扩展,它可能已经做你想做的事(来自这里)典型! :-)
编辑哦,我明白了,大部分代码已经在你的小提琴。您只需使用
$parentItem.data('item.autocomplete');
即可。Here is a demo that I think does what you want. I suspect there is a better way of doing this though. I literally took the part of the question about TAB and bound an event to that key.Note: I have just seen your comment on the question, so will have a look at that demo as well now. So in my demo the JSON data is in a different format, so it might need some tweaking.
Oh, I've just found an existing extension that might already do what you want (from here) Typical! :-)
Edit Oh I see, most of the code is already done in your fiddle. All you need to just use
$parentItem.data('item.autocomplete');
.