gpt4 book ai didi

html - 定位 HTML SELECT 的下拉窗口

转载 作者:太空狗 更新时间:2023-10-29 14:13:07 26 4
gpt4 key购买 nike

我正在使用 HTML SELECT 标记,并希望确保当用户点击箭头以定位到控件的“文本框”部分下方时打开的窗口。

问题是 IE 似乎只是根据选择任意打开窗口,但我需要确保一致的定位,因为页面上还有其他元素需要始终保持可见

这是当前标记

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div style="margin-left: 5px; margin-top: 5px">
<div style="position: relative;">
<select style="position: absolute; top: 10px; left: 10px;">
<optgroup label="Choice A">
<option value="A-A">Sub choice A</option>
<option value="A-B">Sub choice B</option>
</optgroup>
<optgroup label="Choice B">
<option value="B-A">Sub Choice A</option>
<option value="B-B">Sub Choice B</option>
</optgroup>
</select>
</div>
</div>
</body>
</html>

This is whats happening

最佳答案

对不起。恐怕这是不可能的。问题是<select>下拉菜单使用浏览器的 native 下拉菜单呈现。这意味着样式功能有限并且因浏览器而异。我也看到了您在我的 OSX Chrome 上描述的行为 - 未在选择框下方打开。

可以完全控制样式的唯一方法是使用完全自定义的东西 - 构建 <select>使用 DOM 和 javascript:

看看这个:http://gregfranko.com/jquery.selectBoxIt.js/

在选择一个库时,一定要选择一个可以转换原生的库 <select>标记为自定义 - IE 标记不应该为您的 HTML 自定义。当浏览器没有 JavaScript 时就是这样,你的 <select>下拉菜单应该仍然有效

关于html - 定位 HTML SELECT 的下拉窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23542687/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com