jquery combobox
主要实现的功能有。
1.点击标签,显示所有数据源
2.在text中输入文本,模糊匹配。
3.配置是否必须要选择。
4.添加选中时的事件。
具体描述如下。
combobox原型属性: 原型属性主要的用途为一次设定,所有combobox的实例都可以使用
maxLength 自动搜索时,显示的最大长度,默认为所有,主要是因为搜索出来过多时,影响速率
mustSelect 必须选择,默认为false ,配置该combobox是否必须选择
fieldText 数据源的文本字段,默认为text
fieldValue 数据源的ID字段,默认为id
combobox原型方法
Init() 初始化所有combobox外观,第一个参数为jquery选择器,选择多个可以设定textbox的class,第二个参数为图片地址,
combobox属性
host 该combox对应text的选择器,如“#demo”
dataSource 数据源
defaultText combobox默认显示的值
事件
onSelected 当选择一个options时触发,参数为option的 jquery对象,如参数名为jqdom ,那么id应该是jqdom.attr(‘id’)
text应该为jqdom.text();
dataBind() 绑定combobox的数据源。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title></title>
<link rel="Stylesheet" href="combobox/jquery.combobox.css" />
<script type="text/javascript" src="combobox/jquery-1.3.2-vsdoc2.js"></script>
<script type="text/javascript" src="combobox/jquery.combobox.js"></script>
<script type="text/javascript">
$(function() {
//设置该页面上所有combobox的模式
//combobox.prototype.mustSelect = false; //必须选择参数,默认为false
//combobox.prototype.fieldText = "text"; //设置数据源文本命名,默认为text
//combobox.prototype.fieldValue = "id"; //设置数据源id命名,默认为id
// combobox.prototype.maxLength = 3; //自动搜索显示20项,默认为null.即不限制
//初始化所有combobox
//如果有多个text要改成combobox.请在text上设置class。然后id参数使用‘.class',如 combobox.prototype.init(".demos")
combobox.prototype.init("#demo", "combobox/dropdown.gif"); //绑定
var combo = new combobox("#demo");
combo.dataSource = [{ id: 'i1', text: 't1' }, { id: 'i2', text: 't2' }, { id: 'i3', text: 't3' }, { id: 'i4', text: 't4' }, { id: 'i5', text: 't5'}];
//combo.defaultText = "xx";//text的默认值,默认为text的value;
combo.dataBind();
});
</script>
</head>
<body>
<input type="text" id="demo" value="ab" />
</body>
</html>
目前在ff,ie8中没有问题
jquery combobox的更多相关文章
- jquery easyui combobox 级联及触发事件,combobox级联
jquery easyui combobox 级联及触发事件,combobox级联 >>>>>>>>>>>>>>&g ...
- 自写Jquery插件 Combobox
原创文章,转载请注明出处,https://www.cnblogs.com/GaoAnLee/p/9092421.html 上效果 html <span id='combobox' class=' ...
- 240个jquery插件(转)
http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/File upload Ajax File U ...
- jquery插件库
jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript高手加入其team. jQuery是继prototype之后又一个优秀的Javascrīpt框架.其经典 ...
- 基于jQuery 常用WEB控件收集
Horizontal accordion: jQuery 基于jQuery开发,非常简单的水平方向折叠控件. Horizontal accordion: jQuery jQuery-Horizonta ...
- 强烈推荐240多个jQuery插件提供下载
jQuery 是继 prototype 之后又一个优秀的 Javascript 框架.其宗旨是—写更少的代码,做更多的事情.它是轻量级的 js 库(压缩后只有21k) ,这是其它的 js 库所不及 的 ...
- 240多个jQuery插件
概述 jQuery 是继 prototype 之后又一个优秀的 Javascript 框架.其宗旨是—写更少的代码,做更多的事情.它是轻量级的 js 库(压缩后只有21k) ,这是其它的 js 库所不 ...
- 海量jQuery插件
转自:http://blog.csdn.net/zzq58157383/article/details/6900142 提醒大家在使用的时候注意jQuery包的版本问题,最好是使用相同的版本,因为使用 ...
- jquery插件下载地址
以下是本人收集的jquery插件下载地址: .............版本自行选择. jquery官网:http://jquery.com/ jquery.validate.js 官网下载地址:htt ...
随机推荐
- jquery插件的引用和扩展应用
引入插件,引用的jquery吆喝开发插件的jquery版本一致,引用插件里面所用的图像img图片等,常用的jquery可以通过对其进行函数描述,直接调用,下例子就是改变特定的颜色,插件的使用是在仿网页 ...
- ST第二次作业,相关程序测试及测试用例
public static int findLast(int[]x,int y){ for(int i = x.length-1;i>0;i--){//i>=0 if(x[i] == y) ...
- array_multisort 的详细使用方法
1.如果第一个数组有相同的元素,那么后面对应位置的元素位置如何排序呢,请看下列代码$a1=array("Dog","Dog","Cat"); ...
- 【转载】让你的MATLAB代码飞起来
原文地址:http://developer.51cto.com/art/201104/255128_all.htm MATLAB语言是一种被称为是"演算纸"式的语言,因此追求的是方 ...
- shh(struts+spring+Hibernate)的搭建
一.Struts 一.struts的流程 (1)首先,用户在地址栏中输入你的项目访问路径,然后这个请求会发送到服务器,服务器先找到要web.xml的,给web.xml中配置了一个filter过滤器,过 ...
- Struts2中通过超链接传参数要注意的问题
写到分页的功能,在传递页码pageNo的时候遇到了参数接收不正确的问题,我本来在action中是定义了一个pageNo字符串参数和一个Page类参数,Page是一个封装了页面要显示的数据集合和页面信息 ...
- 怎样用vs 2008 编译C程序
在大学里都习惯了vc6.0,但是它的集成度并不好,刚试着用vs2008,简单说一下用vs2008编译c的方法吧 首先,在file中新建工程project ,确定之后,会出现新工程(new projec ...
- [原创]cocos2d-x研习录-第三阶 背景音乐和音效
在游戏中,音效是一个不可或缺的部分,它可以为我们的游戏增加效果.音效在游戏中一般分为长时间的背景音乐和短促的特效音乐.Cocos2D-x支持多种常见音乐格式(mp3.wav等). Cocos2D-x提 ...
- HTML 表格
HTML 表格:表格由<table>标签来定义,行数由<tr>标签来定义,单元格由<td>标签来定义:<table border="1"& ...
- php excel读取
当然首先要判断是否有文件和文件类型,接着把文件保存到某个路径中 /** * 读取excel数据 * @author Red * @date * @param $filename 文件所在路径+文件名 ...