许多类似的没有ID的AJAX建议框

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

我修改了这个:

$('#suggest').autocomplete(

对此:

$('.suggest').autocomplete(

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

所以,我想我知道你在问什么。 页面上有几个input元素,其中没有一个具有id属性,但具有name属性。 每个input都附加一个单独的autocomplete小部件,您希望查询URL作为数据源,如果input正在与之交互,则传入name

好。

我设置了一个小提琴来做我上面描述的事情,我认为这就是你想要的。 在这里查看: 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()将从输入中获取名称/值对,而无需知道其idname属性。 使用回调函数作为自动完成源时,可以使用$(this.element)来获取与之交互的元素。

我建议查看自动完成的示例,该示例使用回调函数作为远程数据源以获取更多详细信息。

jQuery UI自动完成插件应该为你做的伎俩。 这似乎是你之前尝试使用的一小部分,但阅读文档应该会让你通过它更好一点:

http://jqueryui.com/demos/autocomplete/

请确保:

  • 在页面上包含jquery ui的脚本和样式表
  • 充分利用$(this)来引用正在使用的元素。 上面的示例是选择所有文本输入。

如果您在此之后仍然感到困惑,我很乐意提供更具体的指导,如果您可以在此处删除大部分解释并向我们提供不起作用的实际代码,但只要您了解$(这个)概念,我认为这应该能满足你的需求。