使用jquery.editable-select可以实现可编辑下拉框的功能，但需要先导入jquery.js,jquery.editable-select.css,jquery.editable-select.js这三个文件。

 <!doctype html>

 <html lang="en">

 <head>

   <meta charset="utf-8">

   <title>test</title>

   <script src="/static/thirdpart/jquery/jquery.js"></script>

   <script src="/static/thirdpart/jquery/jquery.editable-select.js" ></script>

   <link  rel="stylesheet"  type="text/css"  href="/static/thirdpart/jquery/css/jquery.editable-select.css"/>

 </head>

 <body>

 <div id="editbox" style="display:inline;" >

     <label >可编辑下拉框</label>

     <select class="makeEditable" name="employee_id_list" id="employee_id_list" style=" width:110px;margin-top:20px;"  >

         <option value="ActionScript">ActionScript</option>

             <option value="AppleScript">AppleScript</option>

             <option value="Asp">Asp</option>

             <option value="BASIC">BASIC</option>

             <option value="C">C</option>

     </select>

 </div>

 <script  type="text/javascript" >

        $('#employee_id_list').editableSelect(

            {

                bg_iframe: false,

                case_sensitive: false,

                items_then_scroll: 10 ,

                isFilter:false,

                onSelect: function(list_item) {

                    var sele_val =  $("#editbox #employee_id_list_sele").val();

                 console.log("selece",sele_val)

               },

          });

 </script>  

 <script>

       $(document).ready(function(){

         $("#editbox #employee_id_list_sele").keyup(function(){

           var sele_val =  $("#editbox #employee_id_list_sele").val();

           //if (sele_val.length==3)

                  console.log("keyup",sele_val)

         });

       });

 </script>

 </body>

 </html>

jquery.editable-select 可编辑下拉框之获取select值和input值的更多相关文章

  1. jquery美化select，自定义下拉框样式

    select默认的样式比较丑,有些应用需要美化select,在网上找到一个很好的美化样式效果,本人很喜欢,在这里分享一下. <!DOCTYPE html PUBLIC "-//W3C/ ...

  2. 雷林鹏分享：jQuery EasyUI 表单 - 格式化下拉框

    jQuery EasyUI 表单 - 格式化下拉框 本教程向您展示如何创建一个简单的下拉框(Combobox),让它在下拉框中显示图片项.您可以在下拉框(combobox)上使用 formatter ...

  3. 第二百一十二节，jQuery EasyUI，Combo(自定义下拉框)组件

    jQuery EasyUI,Combo(自定义下拉框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Combo(自定义下拉框)组件的使用方 ...

  4. selenium处理select标签的下拉框

    有时候我们会碰到<select></select>标签的下拉框.直接点击下拉框中的选项不一定可行.Selenium专门提供了Select类来处理下拉框. <select  ...

  5. 前端 HTML form表单标签 select标签 option 下拉框

    <select></select> select里面通常跟option配合使用 <!DOCTYPE html> <html lang="en&quo ...

  6. 下拉框处理（select）

    在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框. 第一种方法 基于webdriver的两次click,很容易出现问题,不建议使用.(由于部分下拉框在点击一次后,失去焦点再 ...

  7. bootstrap 的可编辑下拉框 jquery.editable-select

    搜了半天发现在某处下载jquery.editable-select需要积分,于是整理出来方便 其他人. 先上下载链接:http://pan.baidu.com/s/1kUXvwlL      pass ...

  8. bootstrap可编辑下拉框jquery.editable-select

    搜了半天发现在某处下载jquery.editable-select需要积分,于是整理出来方便 其他人. 先上下载链接: http://pan.baidu.com/s/1kUXvwlL      pas ...

  9. Jquery+json绑定带层次下拉框（select控件）

    一.实现的效果图 备注: 1.主要实现添加类别绑定到Ztree树之后,select下拉框在不刷新页面的情况下,通过Jquery重新绑定问题,增加用户体验度: 2.这个只是实现两层的绑定,通过sql语句 ...

随机推荐

  1. 51nod 2006 飞行员配对(二分图最大匹配) 裸匈牙利算法 求二分图最大匹配题

    题目: 题目已经说了是最大二分匹配题, 查了一下最大二分匹配题有两种解法, 匈牙利算法和网络流. 看了一下觉得匈牙利算法更好理解, 然后我照着小红书模板打了一遍就过了. 匈牙利算法:先试着把没用过的左 ...

  2. C语言定义从URL中获取键值的接口

    环境:centos7下,对客户端http请求进行解析,来获取有效键值(包括汉字). 头文件 /* 这是一份关于从Http请求信息中提取键值的接口声明的头文件 */ #ifndef _HEAD_H_ # ...

  3. 翻译：MLAPP（2.1节）

    笔者:尝试翻译MLAPP(Machine Learning: a Probabilistic Perspective)一书,供机器学习的学者参考,如有错误理解之处请指出,不胜感激!(如需转载,请联系本 ...

  4. Problem 2062 Suneast & Yayamao 二进制（多重背包的理解基础）

                                          Problem 2062 Suneast & Yayamao Accept: 143    Submit: 313T ...

  5. 概率图模型PGM——D map， I map， perfect map

    若F分布的每个条件独立性质都反映在A图中,则A图被称为F分布的D map. 若A图表现出的所有条件独立性质都在F分布中满足(与F分布不矛盾),则A图被称为F分布的I map. 弱A图既是F分布的D m ...

  6. 《算法导论》学习总结 — XX.第22章 图的基本算法

    BFS(广搜): 广搜就是广度优先搜索,根据名字可以知道,是通过广度来遍历图,也就是层次遍历吧. 在这里以及下面的DFS(深搜),都用到了颜色WHITE,GRAY,BLACK,不过作用不同,具体分别再 ...

  7. 第9期Unity User Group Beijing图文报道：《Unity实战经验分享》

    时间来到了金秋九月,北京UUG活动也来到了第九期.本次活动的主题为<Unity实战经验分享>,为此我们邀请了3位资深的行业大神.这次我们仍然在北京市海淀区丹棱街5号微软大厦举行活动,在这里 ...

  8. java泛型使用总结

    1. 泛型方法: 2. 泛型类: 3. 通配符. 1.泛型方法 泛型方法在调用时可以接收不同类型的参数.根据传递给泛型方法的参数类型,编译器适当地处理每一个方法调用. 下面是定义泛型方法的规则: 所有 ...

  9. 使用wget做站点镜像及wget的高级用法

    本文为大家介绍 使用wget做站点镜像及wget的高级用法,供大家学习参考. # wget -r -p -np -k http://xxx.edu.cn -r 表示递归下载,会下载所有的链接,不过要注 ...

  10. JS高级. 05 词法作用域、变量名提升、作用域链、闭包

    作用域 域,表示的是一个范围,作用域,就是作用范围. 作用域说明的是一个变量可以在什么地方被使用,什么地方不能被使用. 块级作用域 JavaScript中没有块级作用域 { var num = 123 ...