我正在尝试使用 jQuery ui 库创建一个网页。我的设计在表单顶部的输入字段上使用 jQuery ui 自动完成功能。紧邻此自动完成输入表单的下方是一些 jQuery 滑块。问题是，当填充自动完成框时，结果显示在滑块控件的手柄后面。这来自 jQuery 构建滑块的方式，该方式使滑块的 z 索引为 3。jquery 自动完成控件的下拉部分的 z 索引似乎始终设置为 1。我尝试增加 z - 自动完成的输入元素的索引，但这似乎不会影响 jquery 为自动完成下拉列表创建的元素的 z 索引。我还尝试编写自己的 javascript 来按类（它是 ul）获取下拉菜单元素并手动设置它的 z-index。这似乎也不起作用。我假设这意味着，jQuery 代码以某种方式覆盖了我所做的 z-index 更改。这不是浏览器错误，而是 Firefox、Chrome、Safari 和 IE 上的问题。这是 jQuery 给出的下拉框（UL 元素）实际 z-index 的问题。
有人有解决这个问题的办法吗？人们通常如何摆弄 jQuery 自动生成的元素来构建其控件。
使用打开和关闭事件修改 z-index 对我有用：
$( "#tags" ).autocomplete({
source: availableTags,
open: function(event, ui) { $(".ui-slider-handle").css("z-index", -1); },
close: function(event, ui) { $(".ui-slider-handle").css("z-index", 2); }
});
查看演示here.
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
