页面用到自动完成功能及需要taginput控件去展示,查资料的过程中发现

有两个类似的jQuery类库,到现在我也没搞明白它们两个有啥关联,jquery.tagsinput.js和bootstrap-tagsinput.js,后者在github上有(https://github.com/bootstrap-tagsinput/bootstrap-tagsinput),官网地址:http://jquery-plugins.net/bootstrap-tags-input;

前者的用法

$(selector).tagsInput({
'autocomplete_url': url_to_autocomplete_api,//这个参数可以试url或者js方法
'autocomplete': { option: value, option: value},//这个参数只有当使用旧版的autocomplete类库才有用,对集成到JQuery.ui中的无效
'height':'100px',
'width':'300px',
'interactive':true,
'defaultText':'add a tag',
'onAddTag':callback_function,
'onRemoveTag':callback_function,
'onChange' : callback_function,
'removeWithBackspace' : true,
'minChars' : 0,
'maxChars' : 0 //if not provided there is no limit,
'placeholderColor' : '#666666'
});

  这里有个坑 autocomplete补充的下拉,是个对象,select的option会有 value和label,当我们点击选中的时候会只会讲value 传递个taginput,因为taginput只能是字符串,没有对对象进行处理,所有只能修改源码,处理value是个对象的情况(需要处理的问题有两点,一是taginput的显示字段,另一个是我们需要取到的值,因为每次点击autocomplete的下拉框都会触发taginput的addTag方法,因此可以直接修改addtag方法)

taginput ,complete使用笔记的更多相关文章

  1. Code Complete阅读笔记(三)

    2015-05-26   628   Code-Tuning Techniques    ——Even though a particular technique generally represen ...

  2. Code Complete阅读笔记(二)

    2015-03-06   328   Unusual Data Types    ——You can carry this technique to extremes,putting all the ...

  3. Code Complete阅读笔记(一)

    代码大全也读了好几个月了,一开始读中文版,到现在慢慢尝试着读原版,确实感受到了"每天进步一点点"的魅力.遗憾的是没有从一开始就做阅读记录,总有不能尽兴和思路不清之感.确实,就像项目 ...

  4. Udemy - Angular 2 - The Complete Guide 笔记

    1. install > npm install -g angular-cli 2. create app > ng new first-app 3. build app > cd ...

  5. 【刷题笔记】LeetCode 222. Count Complete Tree Nodes

    题意 给一棵 complete binary tree,数数看一共有多少个结点.做题链接 直观做法:递归 var countNodes = function(root) { if(root===nul ...

  6. Code Complete 笔记—— 第二章 用隐喻来更充分理解软件开发

    在这章里面,提到的隐喻,类同于比喻(建模)的方法的去理解软件开发. 隐喻的优点在于其可预期的效果能被所有人所理解.不必要的沟通和误解也因此大为减低,学习与教授更为快速,实际上,隐喻是对概念进行内在化和 ...

  7. Code Complete 笔记—— 第一章

    软件的构建的主要流程: 定义问题 ( Problem Definition) 需求分析 (Requirements Development) 规划构建 (construction planning) ...

  8. Modular Rails: The complete Guide to Modular Rails Applications 笔记

    fix SamuraiCRM/engines/core/test/dummy/config/routes 修改如下 Rails.application.routes.draw do mount Sam ...

  9. gradle学习笔记

    一直想着花时间学习下gradle,今天有空.入门一下.参考:极客学院gradle使用指南,官方文档:gradle-2.12/docs/userguide/installation.html,以及百度阅 ...

随机推荐

  1. java连接数据库步骤

    一.加载JDBC驱动程序 Class.forName(driver) ; 如果直接是上面的代码运行,一定会报错.找不到驱动类java.lang.ClassNotFoundException: com. ...

  2. 微信内嵌浏览器sessionid丢失问题,nginx ip_hash将所有请求转发到一台机器

    现象微信中打开网页,图形验证码填写后,经常提示错误,即使填写正确也会提示错误,并且是间歇性出现. 系统前期,用户使用主要集中在pc浏览器中,一直没有出现这样的问题.近期有部分用户是在微信中访问的,才出 ...

  3. 使用tomcat部署jsp程序

    安装java1.6.0到默认目录 下载apache-tomcat-6.0.32-windows-x86.zip,解压到D:\soft目录下 配置环境变量 JAVA_HOME C:\Program Fi ...

  4. python 筛选股票

    x[0] = '0' or x[0]='6' or x[0]='3' len(x)=6 x.isdigit() *但是有的债券也是6位 *比如010007.IB

  5. 使用 AngularJS 和 Electron 构建桌面应用

    GitHub 的 Electron 框架(以前叫做 Atom Shell)允许你使用 HTML, CSS 和 JavaScript 编写跨平台的桌面应用.它是io.js 运行时的衍生,专注于桌面应用而 ...

  6. C#/ASP.NET MVC微信公众号接口开发之从零开发(四) 微信自定义菜单(附源码)

    C#/ASP.NET MVC微信接口开发文章目录: 1.C#/ASP.NET MVC微信公众号接口开发之从零开发(一) 接入微信公众平台 2.C#/ASP.NET MVC微信公众号接口开发之从零开发( ...

  7. WCF传输大数据的设置2

    本节主要内容:1.如何读取Binding中的binding元素.2.CustomBinding元素的基本配置.3.代码示例 一.Bingding是由binding元素构成的,可以根据实际需要,进行适当 ...

  8. [css]零散的重构知识

    1.不建议这样写 font-family:"微软雅黑"; 建议 font-family:Microsoft YaHei; 因为有些网站不兼容中文(GB2312)的字符

  9. jquery 巧用json传参

    JavaScript代码,巧用JSON传参数function AddComment(content) { var comment = {}; comment.threadId = $("#s ...

  10. 掌握Redmine

    一个带有建议.技巧和最佳实践的全面指导和易懂易学的结构. 掌握Redmine 版权©2013 Packt出版 前言(略) 1.熟悉Redmin 我们尝试去做一个新的网站应用程序的时候,回去询问一些了解 ...