更改特定id的jquery自动完成下拉列表的宽度

嗨，我在我的页面中使用Jquery自动完成下拉列表。但是有很多下拉列表。我想更改特定id的宽度。你能帮我一下吗。

$（'#foo'）

将为你提供一个JQuery对象，其中包含具有

id=“foo”

的节点。这应该让你开始。它在JQuery中被称为选择器。如果你打算在JQuery中做很多工作，你应该花一些时间学习选择器之类的东西，因为它们是有效使用该语言的核心。

试试CSS

#<idHere> + .ui-menu {
     width:<widthHere>;
}

#+.ui菜单{
宽度：；
}

---

CSS中的+用于相邻的同级，因此您应该能够将特定div或输入ID中的菜单下拉列表与之匹配

我发现我的“自动完成”上的下拉列表会根据内容自行调整大小

我正在使用item render函数上的覆盖将格式化html添加到每个结果项中，并通过调整item render函数（我已覆盖）中的项大小，调整下拉列表以适应

在使用可调整大小的“Portlet”时，我使用了一个变量来存储所需的宽度，它是基于父div的大小动态存储的。我在ajax成功回调中计算所需的宽度，然后在render函数中使用外部项容器上的style属性设置宽度（目前每个项一个表，因为它比我尝试的所有备选方案更适合我！）：

我用于替代默认项目渲染的函数：

function PatchAutocomplete() {

$.ui.autocomplete.prototype._renderItem = function (ul, item) {
    var re = new RegExp(this.term, 'i');

        var t = "<table class='searchResults' style='width: " + searchResultTableWidth + "px'><tr><td>" +
                            item.clicked.CustomerName.replace(re, function (matchText) { return "<span class='matchedText'>" + matchText + "</span>" }) +
                        "</td><td class='alternateCell'>" +
                        ((item.clicked.MatchedName != "") ?
                                    ("<span class='alternate'>Alternate: <span class='alternateName'>" +
                                        item.clicked.MatchedName.replace(re, function (matchText) { return "<span class='matchedText'>" + matchText + "</span>" })
                                    + "</span></span>")
                                 : "") +
                                 "</td></tr></table>\n";
        return $("<li></li>")
          .data("item.autocomplete", item)
          .append("<a>" + t + "</a>")
          .appendTo(ul);

};

function PatchAutocomplete() {

$.ui.autocomplete.prototype._renderItem = function (ul, item) {
    var re = new RegExp(this.term, 'i');

        var t = "<table class='searchResults' style='width: " + searchResultTableWidth + "px'><tr><td>" +
                            item.clicked.CustomerName.replace(re, function (matchText) { return "<span class='matchedText'>" + matchText + "</span>" }) +
                        "</td><td class='alternateCell'>" +
                        ((item.clicked.MatchedName != "") ?
                                    ("<span class='alternate'>Alternate: <span class='alternateName'>" +
                                        item.clicked.MatchedName.replace(re, function (matchText) { return "<span class='matchedText'>" + matchText + "</span>" })
                                    + "</span></span>")
                                 : "") +
                                 "</td></tr></table>\n";
        return $("<li></li>")
          .data("item.autocomplete", item)
          .append("<a>" + t + "</a>")
          .appendTo(ul);

};

ul.ui-autocomplete.ui-menu { width: 400px; }