自动完成问题到引导模式
我有一个模式对话框引导内的jQuery自动完成显示问题。
当我滚动鼠标时，结果不会保持连接到input。
有没有办法解决这个问题？
这里JsFiddle ：
.ui-autocomplete-input { border: none; font-size: 14px; width: 300px; height: 24px; margin-bottom: 5px; padding-top: 2px; border: 1px solid #DDD !important; padding-top: 0px !important; z-index: 1511; position: relative; } 编辑我发现这个问题：
.ui-autocomplete { position: fixed; ..... }
如果模式有滚动问题仍然存在！
这里JsFiddle / 1 。
该位置是正确的，它是“绝对”，而你需要指定这是一个选项来自动完成 ：
$( ".addresspicker" ).autocomplete( "option", "appendTo", ".eventInsForm" );
在哪里可以将结果固定在任何元素的框中，我必须阻止它被锚定到表单的类！
这是一个工作JsFiddle！ 。
上述解决scheme谈论的z-index问题工作：
.ui-autocomplete { z-index:2147483647; }
确保将其放在负责处理模式和自动完成逻辑的.js脚本之前。
查看appendTo文档 ：
当值为null时，input字段的父项将被检查一个ui-front类。 如果find具有ui-front类的元素，菜单将被追加到该元素。
所以只需将类“ui-front”添加到父元素 ，自动完成将在模态内正确显示。
实际的问题是Bootstrap模态具有比页面中任何其他元素更高的Z-index。 因此，自动完成实际工作 – 但它隐藏在对话框后面。
你只需要添加这个在任何你添加的css文件中：
.ui-autocomplete { z-index:2147483647; }
将类“ui-front”添加到div父元素，自动完成将正确显示在PopUp For Me中。
只是尝试添加这个：
.ui-autocomplete { z-index: 215000000 !important; }
为了解决这个问题，我只需要通过jQuery在css文件中进行修改：
.ui-front { z-index: 9999; }
添加appendTo选项解决了这个问题。 它将菜单附加到引导模型中的一个对象上。
我解决了这个….
/******************************************************************** * CORREZIONE PER L'AUTOCOMPLETE EXTENDER di AJAX TOOLKIt * ********************************************************************/ ul[id*='_completionListElem'] { z-index: 215000000 !important; }
自动完成扩展程序完成列表具有这样的一个utomated ID id =' _completionListElem '
所以你必须推高Z指数..上面然后自举模态面板;）
希望能帮助到你
.ui-front { z-index: 9999; } <div class="modal fade" id="myModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog ui-front"> <div class="modal-content"> <div class="modal-header"> </div> <div class="modal-body"> </div> </div> </div> </div>
