Jquery 自动完成对齐

标签 jquery user-interface autocomplete alignment styling

目前,自动完成结果框与我的输入框的左边缘对齐,并向右侧扩展我给它的宽度。但是,我的业务要求是将其与输入框的右边缘对齐,如果输入框放置在页面的右侧,则将其向相反方向展开,因为结果会被剪切,并且水平滚动会添加到 View 中完整的结果。 (我可以修改我的“jquery-ui.css”)

有人可以帮忙吗?

最佳答案

当前版本的 jQuery UI 允许为自动完成小部件提供一个带有选项的位置对象,其属性与上面提到的位置小部件相同。因此您可以使用它来根据需要放置建议列表。

看这里http://jqueryui.com/demos/autocomplete/#option-position

如果您需要动态更改位置 - 您需要使用“open”事件

代码示例

//Supply a callback function to handle the open event as an init option.
$( ".selector" ).autocomplete({
   open: function(event, ui) { ... }
});
//Bind to the open event by type: autocompleteopen.
$( ".selector" ).bind( "autocompleteopen", function(event, ui) {
  ...
});

在其中您可以更改 css() 中自动编译表单的位置

$('.ui-autocomplete').css({ 'left': x + 'px', 'top': y + 'px' });

PS:我不确定您是否可以仅使用 css 来实现,因为位置取决于父 html 输入字段

关于Jquery 自动完成对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12527532/

相关文章:

使用线程的 Java GUI 群聊应用程序

iOS 7 自定义加载屏幕。 PNG 序列、GIF 或动画图像

javascript - 文本建议超链接

javascript - jQuery 自动完成远程数据源和动态行

javascript - jquery/javascript 将纯文本消息转换为文本输入字段

Android Studio 编辑器自动完成

javascript - 第一个 js 文件中定义的函数在另一个 js 文件中不起作用

javascript - 使用动态注入(inject)的 jquery 追加 html 内容时抛出 TypeError :null is not an object (evaluating "$("body").append") 错误

asp.net - 我正在考虑将 ASP.Net Ajax ScriptManager Javascript 迁移到 JQuery,我需要注意什么?

javascript - JQuery 表单提交到 aspx -- 表单集合为空