使用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值的更多相关文章
-
jquery美化select，自定义下拉框样式
select默认的样式比较丑,有些应用需要美化select,在网上找到一个很好的美化样式效果,本人很喜欢,在这里分享一下. <!DOCTYPE html PUBLIC "-//W3C/ ...
-
雷林鹏分享：jQuery EasyUI 表单 - 格式化下拉框
jQuery EasyUI 表单 - 格式化下拉框 本教程向您展示如何创建一个简单的下拉框(Combobox),让它在下拉框中显示图片项.您可以在下拉框(combobox)上使用 formatter ...
-
第二百一十二节，jQuery EasyUI，Combo(自定义下拉框)组件
jQuery EasyUI,Combo(自定义下拉框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Combo(自定义下拉框)组件的使用方 ...
-
selenium处理select标签的下拉框
有时候我们会碰到<select></select>标签的下拉框.直接点击下拉框中的选项不一定可行.Selenium专门提供了Select类来处理下拉框. <select ...
-
前端 HTML form表单标签 select标签 option 下拉框
<select></select> select里面通常跟option配合使用 <!DOCTYPE html> <html lang="en&quo ...
-
下拉框处理（select）
在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框. 第一种方法 基于webdriver的两次click,很容易出现问题,不建议使用.(由于部分下拉框在点击一次后,失去焦点再 ...
-
bootstrap 的可编辑下拉框 jquery.editable-select
搜了半天发现在某处下载jquery.editable-select需要积分,于是整理出来方便 其他人. 先上下载链接:http://pan.baidu.com/s/1kUXvwlL pass ...
-
bootstrap可编辑下拉框jquery.editable-select
搜了半天发现在某处下载jquery.editable-select需要积分,于是整理出来方便 其他人. 先上下载链接: http://pan.baidu.com/s/1kUXvwlL pas ...
-
Jquery+json绑定带层次下拉框（select控件）
一.实现的效果图 备注: 1.主要实现添加类别绑定到Ztree树之后,select下拉框在不刷新页面的情况下,通过Jquery重新绑定问题,增加用户体验度: 2.这个只是实现两层的绑定,通过sql语句 ...
随机推荐
-
Spring 使用 SLF4J代替 Commons Logging 写日志 异常
项目的日志更换成slf4j和logback后,发现项目无法启动.错误提示 Caused by: java.lang.NoClassDefFoundError: Lorg/apache/commons/ ...
-
第一个有点作用的PHP扩展
C/C++去开发PHP扩展 我觉的对于PHP开发人员来说,学的东西非常杂,也非常多,当然了开发PHP扩展也是一个必须要掌握的技能,这里膜拜下大神鸟哥(Laruence)~ 今天要开发的第一个有点功能的 ...
-
ffmpeg处理RTMP流媒体的命令 发送流媒体的命令（UDP，RTP，RTMP）
将文件当做直播送至live ffmpeg -re -i localFile.mp4 -c copy -f flv rtmp://server/live/streamName re限制输出速率,按照 ...
-
nodejs+express+jade给我baby做个小相册
去年年底迎来了my little star.从此人生多了一个最重要的牵挂.生了宝宝全家人都太忙了.最近宝宝稍微大点了,终于有空可以研究下技术了.这是14年第一帖.废话不多了.开始吧 1.安装NTVS ...
-
hasOwnProperty与isPrototypeOf
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
-
jQuery实现页面元素智能定位
实现过程 Js侦听滚动事件,当页面滚动的距离(页面滚动的高度)超出了对象(要滚动的层)距离页面顶部的高度,即要滚动的层到达了浏览器窗口上边缘时,立即将对象定位属性position值改成fixed(固定 ...
- nginx 要改进的地方基础
-
Big ball of Mud
Big ball of Mud 第一种死法:Big ball of Mud 架构里最常用的反面案例是 big ball of mud.很大程度上可以说打格子,把复杂的系统拆解成小格子是架构师最重要的工 ...
-
overflow-x: scroll;横向滑动详细讲解
overflow-x: scroll;横向滑动(移动端使用详解) css3 , ie8以上 <!DOCTYPE html> <html lang="en"> ...
- tp5分页后数据处理