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

Question

我的网站上有一个搜索框，它使用自动完成功能来提供建议，而且效果很好。现在我想在单个页面上的多个输入字段上使用它。但是，该脚本使用 ID 标签来访问 INPUT 表单框的内容。

我修改了这个:

$('#suggest').autocomplete(

对此:

$('.suggest').autocomplete(

现在我无法使用 getElementsById，如何访问输入框文本？

Answer 1

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

好的。

我设置了一个 fiddle 来执行上面描述的操作，我认为这就是您想要的。在这里查看: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) 来获取正在交互的元素。

我建议查看 autocomplete that uses a callback function as a remote data source 的示例了解更多详情。