1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Basic Combo - jQuery EasyUI Demo</title>
  6.     <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
  7.     <link rel="stylesheet" type="text/css" href="../../themes/icon.css">
  8.     <link rel="stylesheet" type="text/css" href="../demo.css">
  9.     <script type="text/javascript" src="../../jquery.min.js"></script>
  10.     <script type="text/javascript" src="../../jquery.easyui.min.js"></script>
  11. </head>
  12. <body>
  13.     <h2>Basic Combo</h2>
  14.     <p>Click the right arrow button to show drop down panel that can be filled with any content.</p>
  15.     <div style="margin:20px 0"></div>
  16.     <select id="cc" style="width:150px"></select>
  17.     <div id="sp">
  18.         <div style="color:#99BBE8;background:#fafafa;padding:5px;">Select a language</div>
  19.         <div style="padding:10px">
  20.             <input type="radio" name="lang" value="01"><span>Java</span><br/>
  21.             <input type="radio" name="lang" value="02"><span>C#</span><br/>
  22.             <input type="radio" name="lang" value="03"><span>Ruby</span><br/>
  23.             <input type="radio" name="lang" value="04"><span>Basic</span><br/>
  24.             <input type="radio" name="lang" value="05"><span>Fortran</span>
  25.         </div>
  26.     </div>
  27.     <script type="text/javascript">
  28.         $(function(){
  29.             $('#cc').combo({
  30.                 required:true,
  31.                 editable:false
  32.             });
  33.             $('#sp').appendTo($('#cc').combo('panel'));
  34.             $('#sp input').click(function(){
  35.                 var v = $(this).val();
  36.                 var s = $(this).next('span').text();
  37.                 $('#cc').combo('setValue', v).combo('setText', s).combo('hidePanel');
  38.             });
  39.         });
  40.     </script>
  41. </body>
  42. </html>

easyui中自定义下拉框的使用的更多相关文章

  1. android中自定义下拉框（转）

    android自带的下拉框好用不?我觉得有时候好用,有时候难有,项目规定这样的效果,自带的控件实现不了,那么只有我们自己来老老实实滴写一个新的了,其实最基本的下拉框就像一些资料填写时,点击的时候出现在 ...

  2. easyui源码翻译1.32--Combo(自定义下拉框)

    前言 扩展自$.fn.validatebox.defaults.使用$.fn.combo.defaults重写默认值对象.下载该插件翻译源码 自定义下拉框显示一个可编辑的文本框和下拉面板在html页面 ...

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

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

  4. Combo( 自定义下拉框) 组件

    本节课重点了解 EasyUI 中 Combo(自定义下拉框)组件的使用方法,这个组件依赖于ValidateBox(验证框)组件 一． 加载方式自定义下拉框不能通过标签的方式进行创建.<input ...

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

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

  6. jquery easyui无法绑定下拉框内容

    最近在研究jquery easyui的DataGrid,发现DataGrid中的下拉框无法绑定值,找了很久也没发现是具体问题所在,最后还是同事帮忙搞定的.具体问题竟然是jquery easyui提供的 ...

  7. easyui的combobox下拉框初始化默认值以及保持该值一直显示的方法

    easyui的combobox下拉框默认初始值是空,下面是实现从远程加载数据之后初始化默认值,以及让该值一直排在下拉框的最顶部的方式. 目前的需求是需要在初始化的时候添加"全部数据库&quo ...

  8. 关于safari上的select宽高问题小技，自定义下拉框

    之前一直用windows做开发,最近换了个mac,在几经折腾之下,安装完了各种开发工具,IDE等,然后欣然打开自己正在开发的网站.突然发现mac上所有的下拉框都变了,都是默认样式,无论padding, ...

  9. 选择屏幕中的下拉框和dialog中下拉框设计

    REPORT  YTEST014. PARAMETERS: auart LIKE vapma-auart  AS LISTBOX   VISIBLE LENGTH 6. AT SELECTION-SC ...

随机推荐

  1. 12.利用kakatips对网站数据信息监控

    网站信息监控 kakatips软件 百度云链接:https://pan.baidu.com/s/1lNH8OGODbIvYeFTjz6kVEQ 密码:5qtz 这是我编辑好的具体详情如下: 有效标记需 ...

  2. asp.net Log4Net错误日志个人总结

    1)创建Global.asax protected void Application_Start(object sender, EventArgs e) { log4net.Config.XmlCon ...

  3. redis 做默认缓存

    配置: server.port= # REDIS (RedisProperties) # Redis\u6570\u636E\u5E93\u7D22\u5F15\uFF08\u9ED8\u8BA4\u ...

  4. canal 入门（基于docker）

    第一步:安装MySQL:(可以参考:https://my.oschina.net/amhuman/blog/1941540) 命令: sudo docker run -it -d --restart ...

  5. oracle PL/SQL的介绍

    转自:http://blog.sina.com.cn/s/blog_4c302f060101i4o1.html 一 PL/SQL的介绍 1 PL/SQL是什么? PL/SQL(procedural l ...

  6. java ftp主动模式与被动模式

    首先介绍一下主动模式与被动模式: 1.PORT(主动模式) ftpClient.enterLocalActiveMode(); PORT中文为主动模式,工作的原理:FTP客户端连接到FTP服务器的21 ...

  7. iOS响应链原理

    ios找到被点击的view的过程是从根view开始递归地调用hitTest方法,直到有一个子view的hitTest方法返回自身:如果所有一级子view的hitTest方法都返回nil,那么根view ...

  8. vue ...mapMutations 的第一个参数默认为 数据对象state

    1.实现回调后 路由的跳转 mutationsLoginHeaderBackFun(state,$router) { console.log(state); console.log($router); ...

  9. 在page cache中的页，如果当时没有进程read或者write，引用计数到底该为多少

    在一次偶然的机会,在研究如何降低pagecache占用的过程中,走查了 invalidate_mapping_pages的代码: 通过调用 __pagevec_lookup 在radix树中收集一部分 ...

  10. Extjs4 上传图片并进行图片格式以及大小验证

    在做项目是遇到上传图片,并在前端限制图片上传的大小,下面就直接贴出主要的上传图片的代码,以及图片大小的验证,但前端没有验证图片的宽高验证 一.先创建出上传图片的组件,使用filefield组件 var ...