许多类似的AJAX意见箱没有ID [英] numerous similar AJAX suggestion boxes without ID's

查看:61
本文介绍了许多类似的AJAX意见箱没有ID的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的网站上有一个搜索框,它使用自动填充功能来提供建议,而且效果很好。现在我想在单个页面上的几个INPUT字段中使用它。但是,该脚本使用ID标记来访问INPUT表单框的内容。

I have a search box on my site that uses autocomplete to give suggestions, and it works great. Now I want to use it on several INPUT fields on a single page. However, the script uses ID tags to access the contents of the INPUT form box.

我对此进行了修改:

$('#suggest')。autocomplete(

到此:

$('。建议')。自动完成(

如果我失去使用的能力,如何访问INPUT框文本? getElementsById

推荐答案

所以,我想我知道你在问什么。你有几个输入页面上的元素,其中任何一个都没有 id 属性,但 do name attributes。每个输入都附加了一个单独的自动完成小部件,并且您想要查询URL作为您的数据源,如果与输入进行交互,则传递名称

So, I think I know what you're asking. You have several input elements on a page, none of which have id attributes, but do have name attributes. Each input has a separate autocomplete widget attached to it, and you want to query a URL as your data source, passing in the name if the input being interacted with.

好的。

我设置了一个小提琴来做我上面所描述的,我认为是你想要什么。请看这里: http://jsfiddle.net/4GXAm/1/

I set up a fiddle to do what I'm describing above, which I think is what you want. See it here: http://jsfiddle.net/4GXAm/1/

神奇之处在于:

$(".example").autocomplete({
    source: function(request, response) {
        var url = "/suggest/?" + $(this.element).serialize();

        alert("perform an AJAX request with " + url);

        // Respond with the ajax results
        response(["a", "b", "c"]);
    }
}); 

使用 .serialize() 将从输入中获取名称/值对,而无需知道其 id name 属性。当使用回调函数作为自动完成源时,您可以使用 $(this.element)来获取与之交互的元素。

Using .serialize() will get you a name/value pair from the input, without needing to know its id or name attribute. You can get the element being interacted with by using $(this.element) when using a callback function as your autocomplete source.

我建议查看使用回调函数的自动完成的示例远程数据源了解更多详情。

I recommend looking at an example of the autocomplete that uses a callback function as a remote data source for more details.

这篇关于许多类似的AJAX意见箱没有ID的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆