aotocomplete.js

http://blog.csdn.net/smeyou/article/details/7980273?_t_t_t=0.3565731019350138

$(function() {
//alert(goodObj)
//alert(emails)
$('#typeNum').autocomplete(goodObj, {
max: 1000, //列表里的条目数
minChars: 0, //自动完成激活之前填入的最小字符
width: 400, //提示的宽度,溢出隐藏
scrollHeight: 200, //提示的高度,溢出显示滚动条
matchContains: true, //包含匹配,就是data参数里的数据,是否只要包含文本框里的数据就显示
autoFill: false, //自动填充
mustMatch:true,
formatItem: function(row, i, max) {
return i + '/' + max + ':"' + row.typeNum + '"[' + row.serialNum + ']'+"库存:"+'"[' + row.repertory + ']';
},
formatMatch: function(row, i, max) {
return row.typeNum +"/"+ row.serialNum;
},
formatResult: function(row) {
return row.typeNum +"/"+ row.serialNum;
}
}).result(function(event, row, formatted) {
if(row) { //alert(row.serialNum);
//$(this).val(row.typeNum+" "+row.serialNum);
//alert(row.id)
}
//tr.find("input[name=id]").val(data[0]); //不加此判断会报错:data[0]为null
});
});
 var emails = [
{ name: "Peter Pan", to: "gggsa@pan.de",id:1 },
{ name: "Molly", to: "molly@yahoo.com",id:"2" },
{ name: "Forneria Marconi", to: "live@japan.jp",id:3 },
{ name: "Master <em>Sync</em>", to: "205bw@samsung.com",id:4 },
{ name: "Dr. <strong>Tech</strong> de Log", to: "g15@logitech.com",id:5 },
{ name: "Don Corleone", to: "don@vegas.com",id:6 },
{ name: "Mc Chick", to: "info@donalds.org",id:"7" },
{ name: "Donnie Darko", to: "dd@timeshift.info",id:8 },
{ name: "Quake The Net", to: "webmaster@quakenet.org",id:9 },
{ name: "Dr. Write", to: "write@writable.com",id:10 },
{ name: "GG Bond", to: "Bond@qq.com",id:11 },
{ name: "Zhuzhu Xia", to: "zhuzhu@qq.com",id:12 }
]; $(function() {
$('#keyword').autocomplete(emails, {
max: 10, //列表里的条目数
minChars: 0, //自动完成激活之前填入的最小字符
width: 400, //提示的宽度,溢出隐藏
scrollHeight: 300, //提示的高度,溢出显示滚动条
matchContains: true, //包含匹配,就是data参数里的数据,是否只要包含文本框里的数据就显示
autoFill: false, //自动填充
formatItem: function(row, i, max) {
return i + '/' + max + ':"' + row.name + '"[' + row.to + ']'+'"[' + row.id + ']';
},
formatMatch: function(row, i, max) {
return row.name + row.to;
},
formatResult: function(row) {
return row.to;
}
}).result(function(event, row, formatted) {
alert(row.to);
});
});
 var emails = [
{ name: "Peter Pan", to: "gggsa@pan.de",id:1 },
{ name: "Molly", to: "molly@yahoo.com",id:"2" },
{ name: "Forneria Marconi", to: "live@japan.jp",id:3 },
{ name: "Master <em>Sync</em>", to: "205bw@samsung.com",id:4 },
{ name: "Dr. <strong>Tech</strong> de Log", to: "g15@logitech.com",id:5 },
{ name: "Don Corleone", to: "don@vegas.com",id:6 },
{ name: "Mc Chick", to: "info@donalds.org",id:"7" },
{ name: "Donnie Darko", to: "dd@timeshift.info",id:8 },
{ name: "Quake The Net", to: "webmaster@quakenet.org",id:9 },
{ name: "Dr. Write", to: "write@writable.com",id:10 },
{ name: "GG Bond", to: "Bond@qq.com",id:11 },
{ name: "Zhuzhu Xia", to: "zhuzhu@qq.com",id:12 }
]; $(function() {
$('#keyword').autocomplete(emails, {
max: 10, //列表里的条目数
minChars: 0, //自动完成激活之前填入的最小字符
width: 400, //提示的宽度,溢出隐藏
scrollHeight: 300, //提示的高度,溢出显示滚动条
matchContains: true, //包含匹配,就是data参数里的数据,是否只要包含文本框里的数据就显示
autoFill: false, //自动填充
formatItem: function(row, i, max) {
return i + '/' + max + ':"' + row.name + '"[' + row.to + ']'+'"[' + row.id + ']';
},
formatMatch: function(row, i, max) {
return row.name + row.to;
},
formatResult: function(row) {
return row.to;
}
}).result(function(event, row, formatted) {
alert(row.to);
});
});

jquery插件:aotocomplete的更多相关文章

  1. 自己写jquery插件之模版插件高级篇(一)

    需求场景 最近项目改版中,发现很多地方有这样一个操作(见下图gif动画演示),很多地方都有用到.这里不讨论它的用户体验怎么样. 仅仅是从复用的角度,如果每个页面都去写text和select元素,两个b ...

  2. JQuery插件定义

    一:导言 有些WEB开发者,会引用一个JQuery类库,然后在网页上写一写$("#"),$("."),写了几年就对别人说非常熟悉JQuery.我曾经也是这样的人 ...

  3. BootStrap_04之jQuery插件(导航、轮播)、以及Less

    1.列偏移与列排序: ①列偏移:控制列出现的位置,某列偏移后,后序列会随之偏移--只能右偏移: col-lg/md/sm/xs-offset-*; ②列排序:控制某一列的位置,该列可以左(pull)右 ...

  4. 锋利的jQuery--编写jQuery插件(读书笔记五)[完结篇]

    1.表单验证插件Validation   2.表单插件Form   3.动态事件绑定插件livequery 可以为后来的元素绑定事件   类似于jQuery中的live()方法     4.jQuer ...

  5. 2016年6月份那些最实用的 jQuery 插件专辑

    jQuery 是一个快速.流行的 JavaScript 库,jQuery 用于文档处理.事件处理.动画和 Ajax 交互非常简单,学习曲线也很平坦.2016年6月的 jQuery 插件专辑里,我们选择 ...

  6. 教你开发jQuery插件(转)

    教你开发jQuery插件(转) 阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原文: ...

  7. Lazy Load, 延迟加载图片的 jQuery 插件.

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  8. JS原生ajax与Jquery插件ajax深入学习

    序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...

  9. jquery插件扩展的学习

    jquery插件的学习可以点击这里 举个例子 //首先先来一个插件 (function($){ $.fn.extent({ bigfont:function(){ return this.css('f ...

  10. Jquery 插件\Js 插件收集

    1.linq.js 使得js 的数组像c#的linq操作一下样 http://linqjs.codeplex.com/ 2.分页插件 https://github.com/mricle/Mricode ...

随机推荐

  1. Python数据结构——栈

    栈是一种特殊的列表,栈内的元素只能通过列表的一端访问,这一端称为栈顶.栈被称为一种后入先出(LIFO,last-in-first-out)的数据结构. 由于栈具有后入先出的特点,所以任何不在栈顶的元素 ...

  2. linux select函数详解【转】

    转自:http://www.cnblogs.com/ccsccs/articles/4224253.html 在Linux中,我们可以使用select函数实现I/O端口的复用,传递给 select函数 ...

  3. 手动破解的 Linux下的Maltab 2014b

    人人网上一个很不错的东东,转发全文如下: 好久没有写日志了,今天更新一篇. 承蒙 @刘慎修(263525031 )修哥分享的各种激励,发布一发我自创的黑科技. Maltab 2014b 发布了,但是只 ...

  4. Juce-强大的开源类库

    介绍 Juce是一个完全围绕C++语言的类库,用来开发跨平台的应用程序. 完整的用doxgen生成的html形式的API手册可以在这里下到.或者可以从下载页面下载预编译的windows帮助文件. 想获 ...

  5. 非MFC工程中使用MFC库

    目录(?)[-] 需求说明 常见问题 问题分析 参考解决方法 我的解决方案 Stdafxh的原理   需求说明 C++工程的类型有很多,从VS(或VC)可以看到常见的有:Win32 Console A ...

  6. flask框架下的jinja2模板引擎(3)(模板继承与可以在模板使用的变量、方法)

    flask 框架下的jinja2模块引擎(1):https://www.cnblogs.com/chichung/p/9774556.html flask 框架下的jinja2模块引擎(2):http ...

  7. 设计模式-python实现

    设计模式是什么? 设计模式是经过总结.优化的,对我们经常会碰到的一些编程问题的可重用解决方案.一个设计模式并不像一个类或一个库那样能够直接作用于我们的代码.反之,设计模式更为高级,它是一种必须在特定情 ...

  8. 使用composer出现 Cannot find module (SNMPv2-TC) 等错误的解决方法

    Cannot find module (SNMPv2-TC): At line 10 in /usr/share/snmp/mibs/UCD-DLMOD-MIB.txt Cannot find mod ...

  9. MYSQL的longtext字段能放多少数据?

    生产上遇到问题, 同事说MYSQL里的字段放不下5m大小的数据. 于是,将django model里textfield里的max_length变长了. 依然无效, 于是,更改mysql的设置: set ...

  10. aliyun

    阿里云启动不了网站 1  将网站的目录属性-安全中加入IUSER_计算机名字的访问权限     和  加入NER SERVICE的访问权限 2 IIS打开网站属性--目录--执行权限改为顺脚本 3  ...