重新定位jQueryUI自动完成结果框

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (103)

我正在使用Jquery UI Autocomplete插件来提供一个简单的搜索术语建议工具。它运行起来没有问题,除了我不能移动结果框。我基本上需要将它向左移动20个像素,向下移动4个像素。我试图覆盖JQuery UI的CSS,但一直无法重新定位框。

提问于
用户回答回答于

这可以很容易地通过position选项,特别是offsetproperty

$('#myField').autocomplete({
    source: …,
    position: {
        offset: '20 4' // Shift 20px to the left, 4px down.
    }
});
用户回答回答于

以下是一种可以做到的方法:点击open事件并在事件发生时更改菜单的位置:

$("#autocomplete").autocomplete({
    appendTo: "#results",
    open: function() {
        var position = $("#results").position(),
            left = position.left, top = position.top;

        $("#results > ul").css({left: left + 20 + "px",
                                top: top + 4 + "px" });

    }
});

我也使用该appendTo选项来轻松找到ul包含菜单的选项。你可以做到这一点,但没有这个选项。

这是一个工作的例子:http : //jsfiddle.net/9QmPr/

扫码关注云+社区

领取腾讯云代金券