jquery ui 自动完成 id 和关闭事件 ui 参数

发布于 2024-11-26 06:57:08 字数 990 浏览 1 评论 0原文

我正在使用 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” 标记的内容。我想这样做的原因如下......

有一个 close 事件 且其中一个参数是 ui。在“select”中,甚至此 ui 也填充了用于创建自动完成的数据,但对于关闭事件,ui 为空。这就是为什么我想在上一个问题的 ul 标签上添加一个 id。如果我可以获得 ui 数据,那么我就不需要费心设置 id,尽管我认为无论如何它都是一个理想的功能。

希望我说得相当清楚。

编辑:显然,我还不够清楚:)。希望以下内容有助于澄清我的意思: 从自动完成中选择一个项目后,我使用 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

悲念泪 2024-12-03 06:57:08

这是一个演示,我认为它可以满足您的需求。我怀疑有更好的方法可以做到这一点。我确实接受了有关 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');.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文