EasyUI - Combo组件
-自定义下拉组件,有别于ComboBox下拉组件。
效果:

html代码:
<input id ="box" />
<div id ="fruits" style ="padding:5px;">
<div>请选择一种水果:</div>
<div>
<input type ="radio" name ="fruit" value ="01"/><span>苹果</span><br />
<input type ="radio" name ="fruit" value ="02"/><span>香蕉</span><br />
<input type ="radio" name ="fruit" value ="03"/><span>橘子</span><br />
<input type ="radio" name ="fruit" value ="04"/><span>芒果</span><br />
</div>
</div>
JS代码:
$(function () {
$('#box').combo({
// * 集成自ValidateBox *
required: true,
editable: false,
delay:,
missingMessage:'请选择值!',
})
//将内容添加到Combo组件中
$('#fruits').appendTo($('#box').combo('panel'));
//点击选项在文本框中显示值
$('#fruits input').click(function () {
var v = $(this).val();//获取选中radio的value值
var s = $(this).next('span').text();//获取选中radio的text值
//将获取的值,设置到文本框的text,value中,并隐藏panel
$('#box').combo('setValue', v).combo('setText', s).combo('hidePanel');
})
})
EasyUI - Combo组件的更多相关文章
- 表单(上)EasyUI Form 表单、EasyUI Validatebox 验证框、EasyUI Combobox 组合框、EasyUI Combo 组合、EasyUI Combotree 组合树
EasyUI Form 表单 通过 $.fn.form.defaults 重写默认的 defaults. 表单(form)提供多种方法来执行带有表单字段的动作,比如 ajax 提交.加载.清除,等等. ...
- Easyui主要组件用法
Easyui主要组件用法说明: 1. combogrid用法 说明:combogrid可提供翻页列表的数据选择并可进行数据的过滤查询(查询的传人参数为q,可在控制器中获取这个参数传过来的值,下面的示 ...
- Easyui部分组件讲解
Easyui部分组件讲解 目 录 1.... Accordion(可折叠标签)... 2 1.1 实例... 2 1.2 参数... 3 2.... DateBo ...
- 对easyui datagrid组件的一个小改进
#对easyui datagrid组件的一个小改进 ##问题 在实际项目中使用datagrid时,受版面限制,有时候表格不能太大,这时候表格里面的内容就不能完全显示,用户需要经常拖动调整列宽才能看完整 ...
- easyUI panel组件
easyUI panel组件: 属性的使用: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- easyUI progressbar组件
easyUI progressbar组件: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- easyUI linkbutton组件
easyUI linkbutton组件: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- easyUI tootip组件使用
easyUI tootip组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta char ...
- easyUI resizable组件使用
easyUI resizable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
随机推荐
- Uva 167 The Sultan's Successors(dfs)
题目链接:Uva 167 思路分析:八皇后问题,采用回溯法解决问题. 代码如下: #include <iostream> #include <string.h> using n ...
- PHP 自学之路-----XML编程(Xpath技术,simpleXml技术)基础入门
XPAth技术 XPath的设计的核心思想,可以通过xpath迅速简介的定位到你希望查找的节点.主要目的是描述节点相对其他节点的位置,可以取得所有符合条件的节点,成为[位置路径]. Xapth主要用来 ...
- More Divisors(反素数)
More Divisors Time Limit: 2 Seconds Memory Limit: 65536 KB Everybody knows that we use decimal ...
- 使用SharedPreferences即时存储之后,不能即时获取到数据
在这里简介一下我所遇到的情况,由于情况非常特殊,所以我就来记录一下自己在这个方面的经历! 事由:在我所做的app中有一个视频的播放功能,因为之前做优化的时候.我听说对于视频这种比較耗费资源的应该给他独 ...
- C#学习之在辅助线程中修改UI控件----invoke方法
Invoke and BeginInvoke 转载地址:http://www.cnblogs.com/worldreason/archive/2008/06/09/1216127.html 在Invo ...
- [Swust OJ 247]--皇帝的新衣(组合数+Lucas定理)
题目链接:http://acm.swust.edu.cn/problem/0247/ Time limit(ms): 1000 Memory limit(kb): 65535 Descriptio ...
- oracle11g dataguard 完全手册(转)
转自:http://www.cnblogs.com/tippoint/archive/2013/04/18/3029019.html 一.前言: 网络上关于dataguard的配置文章很多,但是很 ...
- iPhone开发技巧之日志保存教程
http://mobile.51cto.com/iphone-283337.htm Objective-C开发程序的时候,有专门的日志操作类NSLog,它将指定的输出到标准的错误输出上(stderr) ...
- 关于jsonp(~~原理和理解)
JSON和JSONP 与XML相比,JSON是一个轻量级的数据交换格式.JSON对于JavaScript开发人员充满魅力的原因在于JSON本身就是Javascript中的对象. 例如一个ticker对 ...
- IEEE浮点数float、double的存储结构
众所周知,C的float.VB的Single都是32位浮点数变量类型(也叫单精度浮点数),C的double和VB的Double则都是64位的浮点数变量类型(也叫双精度浮点数).有些编译器还支持更屌的l ...