jQuery UI selectmenu打破布局

Question

我正在使用此插件：http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/index.html（下拉式）

它运作良好但是当我在页面底部添加一个选择菜单时会发生这种情况：

我如何解决这个问题，当选择菜单位于底部时，下拉菜单位于上方而非下方？

JS我使用：

$('select').not("select.multiple").selectmenu({
    style: 'dropdown',
    transferClasses: true,
    width: null
});

Answer 1

我认为您使用的版本不是最新版本。您应该从GitHub repository检查来源，这是官方存储库。

GitHub的版本使用jQuery UI中的 jquery.ui.position ，它允许您指定相对于元素显示菜单的位置（“顶部顶部”，“左下角”.. 。）以及允许碰撞检测。

来自documentation：

  

当定位元素在某个方向溢出窗口时，   把它移到另一个位置。与my和at类似，这是接受的   单个值或一对水平/垂直，例如。 “翻转”，“合适”，   “适合翻转”，“不适合”。

所以你宁愿用这种方式使用插件：

$('#myelement').selectmenu({
    ...
    position: {
        my: "left top", // default
        at: "left bottom", // default

        // "flip" will show the menu opposite side if there
        // is not enough available space

        collision: "flip"  // default is ""
    }
});

检查以下question是否解释了类似的问题（方法_refreshPosition()似乎不再存在，但选项位置当然仍然存在）。