在其他元素之上显示JQuery UI自动完成建议

Question

我正在使用JQuery UI Autocomplete在地图控件上建议不同的城市。我通常有其他div显示内容干扰自动完成的建议。 div显示在建议之上。

更改这些div的z-index是建议具有最低z-index的点。

选择的策略是修改建议的z-index以显示在顶部。我们的想法是将处理程序附加到将z-index更改为最高值的建议的load事件。由于在控件创建时无法提供建议，因此必须使用.live（）附加处理程序。我做了以下事情：

$('ul.ui-autocomplete').live('load',function(){
this.css('z-index',3999);
});

问题似乎是我没有很好地附加处理程序，因为它没有被解雇。有什么想法吗？

Answer 1

我找到了一种解决方法来使其工作。我真的不喜欢它，因为它取决于下拉列表的搜索时间几秒钟以“确保”它将可用。你需要这个，因为当触发open事件时，还没有创建下拉列表。如果您将以下功能注册到open事件

function() {
  $(this).removeClass("ui-corner-all").addClass("ui-corner-top");
  setTimeout("$('ul.ui-autocomplete').css('z-index',3999)",500);
}

虽然这有效，但我仍然在寻找确定性的回应。

Answer 2

在代码行下方使用此选项：

$(".selector").autocomplete("option", "position", {my: "right top", at: "right bottom"});