下拉框增加可输入文本

最新推荐文章于 2022-04-01 14:38:50 发布

weixin_30251829

最新推荐文章于 2022-04-01 14:38:50 发布

阅读量313

点赞数

原文链接：http://www.cnblogs.com/s313139232/p/7381425.html

版权

原理：

　　将下拉框用一个input盖住，再将select的值改入input内。

代码：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style>
        #Layer1{position:relative;width:161px;   height:40px;   z-index:0;}
        #Layer1>select{position:absolute;width:182px  height:14px;   z-index:2;}
        #Layer1>input{position:absolute; width:159px; height:14px; z-index:3;}
    </style>
</head>
<body>
<form>

    <div   id="Layer1" >
        <select   name="select"  onchange="txtID.value=this[selectedIndex].text">
            <option>111111</option>
            <option>22222222</option>
            <option>3333333</option>
            <option>4444</option>
        </select>
        <input type="text" name="txtID"  size="8"   value=""   maxlength=8>
    </div>

</form>
</body>
</html>

转载于:https://www.cnblogs.com/s313139232/p/7381425.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_30251829

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
下拉框增加可输入文本

原理：　　将下拉框用一个input盖住，再将select的值改入input内。代码：<!DOCTYPE html><html><head> <title></title> <meta http-equiv="Content-Type" content="text/html; ch...
复制链接

扫一扫