主要实现的功能有。

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的更多相关文章

  1. jquery easyui combobox 级联及触发事件,combobox级联

    jquery easyui combobox 级联及触发事件,combobox级联 >>>>>>>>>>>>>>&g ...

  2. 自写Jquery插件 Combobox

    原创文章,转载请注明出处,https://www.cnblogs.com/GaoAnLee/p/9092421.html 上效果 html <span id='combobox' class=' ...

  3. 240个jquery插件(转)

    http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/File upload Ajax File U ...

  4. jquery插件库

    jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript高手加入其team. jQuery是继prototype之后又一个优秀的Javascrīpt框架.其经典 ...

  5. 基于jQuery 常用WEB控件收集

    Horizontal accordion: jQuery 基于jQuery开发,非常简单的水平方向折叠控件. Horizontal accordion: jQuery jQuery-Horizonta ...

  6. 强烈推荐240多个jQuery插件提供下载

    jQuery 是继 prototype 之后又一个优秀的 Javascript 框架.其宗旨是—写更少的代码,做更多的事情.它是轻量级的 js 库(压缩后只有21k) ,这是其它的 js 库所不及 的 ...

  7. 240多个jQuery插件

    概述 jQuery 是继 prototype 之后又一个优秀的 Javascript 框架.其宗旨是—写更少的代码,做更多的事情.它是轻量级的 js 库(压缩后只有21k) ,这是其它的 js 库所不 ...

  8. 海量jQuery插件

    转自:http://blog.csdn.net/zzq58157383/article/details/6900142 提醒大家在使用的时候注意jQuery包的版本问题,最好是使用相同的版本,因为使用 ...

  9. jquery插件下载地址

    以下是本人收集的jquery插件下载地址: .............版本自行选择. jquery官网:http://jquery.com/ jquery.validate.js 官网下载地址:htt ...

随机推荐

  1. PHP常用数组函数介绍

    array_splice() 删除数组中的指定元 array_splice(数组名,从前往后删的个数,new一个数组的大小);没有第三参数也就没有返数组,没有第三个参数时,第二个参数的意义为从前往后保 ...

  2. 转自一个CG大神的文章

    <如何学好游戏3D引擎编程>此篇文章献给那些为了游戏编程不怕困难的热血青年,它的神秘要我永远不间断的去挑战自我,超越自我,这样才能攀登到游戏技术的最高峰           ——阿哲VS自 ...

  3. 解决嵌入式linux系统下iconv库的移植问题

    一.解决问题    在arm开发板上使用framebuff,在汉字显示时,因为只有gb2312的16*16的汉字字库,而ubuntu16.04默认    的编码方式时utf-8,因此需要进行转码(ut ...

  4. Enum.GetHashCode()的问题

    先说一下,正常如果代码可以定义成枚举,我是比较倾向于定义成枚举的,类似这样: public enum Gender { /// <summary> /// 男 /// </summa ...

  5. T-SQL - 访问远程数据库并对其数据表进行操作

    一.概述 很多时候我们需要在.NET应用程序中使用一条SQL语句来访问来自不同服务器.不同数据库中的不同的表,实现方法有很多.我们可以在.NET应用程序中建立数据访问层,使用ADO.NET Entit ...

  6. hdu 1010 深搜+剪枝

    深度搜索 剪枝 还不是很理解 贴上众神代码 //http://blog.csdn.net/vsooda/article/details/7884772#include<iostream> ...

  7. JSBInding+Bridge.NET:把C#编译为Js

    编译步骤: 1. 用 VS 2015 打开 BridgeProj/BridgeProj.sln ,编译 2. 将生成 BridgeProj/Bridge/output/bridge.js,对应于 Br ...

  8. Arcgis 图层编辑器“粘贴”功能菜单灰色不能使用的问题与解决办法

    本人由win7系统更换为win10系统,平常使用的arcgis10.2升级使用10.3版本,相应的VS2012也升级使用2013版本,但是在安装了之后发现"Editor"编辑工具中 ...

  9. oracle数据库从入门到精通

    oracle产品线围绕企业开发平台的企业开发平台四大组件:unix,weblogic中间件,java编程语言,oracle数据库oracle 开发主要分两类数据库管理:dba数据库编程:分两部分   ...

  10. Ansible Tower

    # Generated by iptables-save v1.4.7 on Tue Aug 23 04:58:34 2016 *filter :INPUT ACCEPT [0:0] :FORWARD ...