对话框中的jquery-ui可滚动列表

Question

我在我的 crm 2011 应用程序中使用 JQuery-Ui。 我使用 jquery-ui-dialog 显示列表，但是当列表太长时，我希望出现垂直滚动条。现在列表超出了表单的长度。 我尝试设置对话框的最大高度，但什么也没发生 - 也许我没有以正确的方式做到这一点..（我是 jquery 和 css 的新手）。 我会很感激任何帮助，谢谢！

var listItemsString = "";

for (var i = 0; i < listItemsArray.length; i++) {
    listItemsString += "<li class='ui-widget-content'>" + listItemsArray[i] + "</li>";
}

var div = $("<div id='myListDialog' title='this is the title'><p class='validateTips'>this is the description</p>"
                + "<form><ul id='selectable'>" + listItemsString + "</ul></form></div>");

$("body").prepend(div);

$("#selectable ul").css({ "list-style-type": "none", "margin": "0", "padding": "0", "width": "60%" });
$("#selectable li").css({ "margin": "3px", "padding": "0.4em", "height": "14px" });

$("#selectable").selectable({ selected: listSelectfunction ,unselected: listUnselectfunction});

$("#myListDialog").dialog({
    height: 20,
    modal: true,
    autoOpen: true,
    draggable: false,
    resizable: false,
    position: [350, $(window.parent.document).scrollTop() + 500 / 2],
    closeOnEscape: false,
    open: function (event, ui) { $(".ui-dialog-titlebar-close").hide(); },
    buttons: buttons
});

Answer 1

您可以将对话框中的任何内容设置为最大高度（最大高度），并通过将溢出设置为自动使其在其中滚动。 看到这个小提琴：http://jsfiddle.net/582ms/1/

.child {
    max-height:150px;
    overflow: auto;
    width: 150px;
}