HTML可编辑下拉框的实现

2017-01-13 19:22:27来源:CSDN作者:qq_35952946人点击

直接上代码:

<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><style type="text/css">         .iInput{                position: absolute;               width: 99px;                height: 16px;               left: 1px;                top: 2px;                border-bottom: 0px;              border-right: 0px;               border-left: 0px;               border-top: 0px;            }   </style><script type="text/javascript">function aa() {    var a = document.getElementById("input").value;    alert(a);}</script><title>Insert title here</title></head><body><div style="position:relative;">                <select style="width:120px;" onchange="document.getElementById('input').value=this.value">                  <option value="A类">A类</option>                  <option value="B类">B类</option>                  <option value="C类">C类</option>                  <option value="D类">D类</option>                </select>                <input id="input" name="input" class="iInput">                <input type="button" value="提取值" onclick="aa()">        </div> </body>

理解:1、一个select和一个input重合在一起。
2、select每触发一次onchange就把获取到的值存进input中
3、最后直接获取input中的值即可。

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台