可输入的select下拉框

news/2024/7/21 3:50:26 标签: IE, Firefox, QQ, IDEA, HTML

      当select下拉框中没有要选择的信息项时,可以直接在select中输入自己想要得信息项。

 

      在输入信息项时,不改变select下拉框中原有的信息项。

 

      通过Backspace键可以清除刚才输入的信息项,以便重新输入。如果不清除,再输入信息时,会在原来输入的基础之上继续添加信息。如:原来手动输入信息是111,如果不清除再输入222时,信息项就变成111222 

 

<html>
<head>
<title>可输入的select下拉框</title>
</head>
<script>
   
</script>
<body >
<select style='width:150px;z-index:-1' id="aa" name="selectHelpCode" οnkeydοwn="if(event.keyCode == 8){this.options[0].text = '';}" οnkeypress="writeSelect(this)">
    <option value=""></option>
    <option value="11">11</option>
    <option value="22">22</option>
    <option value="33">33</option>
</select>

<input type="button" value="点我" οnclick="ttt();"/>

<script>
   
    function writeSelect(obj){
        obj.options[0].selected = "select";
        obj.options[0].text = obj.options[0].text + String.fromCharCode(event.keyCode);
        event.returnValue=false;
        return obj.options[0].text;
    }

    function ttt(){
        var ss = document.getElementById("aa").value;
        var jg = "";
       
        if(ss == ""){
            var aas = writeSelect(document.getElementById("aa"));
            jg = aas;
        }else{
            jg =     document.getElementById("aa").value;
        }
       
      alert(jg);
}
    </script>

</body>
</html>

 

    代码只是为了展示select下拉框可输入情况,具体一些细节方面,有待完善。


http://www.niftyadmin.cn/n/1764621.html

相关文章

项目冲刺——总结

项目预期计划和现实进展 任务完成情况欢迎界面已完成侧滑列表已完成新增计划、新增书籍弹窗已完成可折叠计划列表已完成增加修改计划已完成选择感兴趣的话题已完成我的书籍列表已完成打开手机文件管理已完成显示对应目录以及下属的文件以及文件夹已完成读取PDF文件已完成书籍归…

非常精美的ext桌面系统,超级帅

预览地址&#xff1a;http://www.qwikioffice.com/desktop-demo/login.html图&#xff1a;

Java中的ReentrantLock和synchronized两种锁定

原文&#xff1a;http://www.ibm.com/developerworks/cn/java/j-jtp10264/index.html 多线程和并发性并不是什么新内容&#xff0c;但是 Java 语言设计中的创新之一就是&#xff0c;它是第一个直接把跨平台线程模型和正规的内存模型集成到语言中的主流语言。核心类库包含一个 T…

JS日期操作

时间对象是一个我们经常要用到的对象&#xff0c;无论是做时间输出、时间判断等操作时都与这个对象离不开。除开JavaScript中的时间对象外&#xff0c;在VbScript中也有许多的时间对象&#xff0c;而且非常好用。下面还是按照我们的流程来进行讲解。 它是一个内置对象——而不…

15位和18位身份证的正则表达式及其验证

1、简单的正则表达式&#xff1a; &#xff08;1&#xff09;preg_match("/^(\d{18,18}|\d{15,15}|\d{17,17}x)$/" ,$id_card) &#xff08;2&#xff09;preg_match("/^(\d{6})(18|19|20)?(\d{2})([01]\d)([0123]\d)(\d{3})(\d|X)?$/" ,$id_card) &…

js基础第四天

多个tab栏切换class封装 <style> *{margin:0;padding:0;} ul{list-style:none;} .box { width: 350px; height: 300px; border:1px solid #ccc; margin: 100px auto; overflow: hi…

你不知道的 JavaScript - “this”

JavaScript 里的 this 到底指得是什么&#xff1f;很多人都会告诉你 this 指的是当前对象。这样理解对么&#xff1f;在大多数情况下确实没错。比如我们经常会在网页上写这样的 JavaScript&#xff1a; < input type "submit" value "提交" onclick …

ubuntu下解析udt数据包

udt是通过udp进行端到端可靠传输的一个协议&#xff0c;有其默认拥塞控制算法。 之前ubuntu下wireshark的版本是1.10&#xff0c;不能直接解析udt数据包[1]&#xff0c;升级到最新的2.0.0即可过滤udt数据包 升级wireshark 下载wireshark源码&#xff0c;目前下载的是wireshark-…