页面用到自动完成功能及需要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. Android NDK 初探,生成so文件以及调用so文件方法

    因为最近业务上涉及安全的问题 然后有一些加密解密的方法和key的存储问题 本来想存储到手机里面,但是网上说一般敏感信息不要存储到手机Sdcard上 而且我这个如果从网络建立通信获取的话,又太耗时,所以 ...

  2. nginx学习记录/2016.11.14

    nginx(engine X)是一个高性能的web服务器和反向代理服务器以及电子邮件代理服务器 由俄罗斯的程序设计师Igor Sysoev所开发 nginx+tomcat实现负载均衡 参考地址:htt ...

  3. 习题 5: 更多的变量和打印 | 笨办法学 Python

    一. 简述 “格式化字符串(format string)” -  每一次你使用 ' ’ 或 " " 把一些文本引用起来,你就建立了一个字符串. 字符串是程序将信息展示给人的方式. ...

  4. linux发行版基础目录

    linux发行版基础目录 linux 基础目录 linux基础目录 目录 作用 / 根目录,起源 /boot linux引导启动目录 /lib 库目录 /bin 常用内部命令 /sbin 常用内部管理 ...

  5. CentOS7 yum 安装git

    1.查看系统是否已经安装git git --version 2.CentOS7 yum 安装git yum install -y git 3.安装成功 4.卸载git yum remove git

  6. Scala学习(二)

    二.Scala基础 1.变量:三种修饰符 -> ①val 常亮②var 变量③lazy val 惰性变量求值 2.类型 3.代码块 Block {exp1;exp2} 或 { exp1 exp2 ...

  7. IIS部署WCF网站服务步骤

    一开始在“管理工具”下找不到IIS的快捷方式,是因为系统默认未打开IIS功能,所以首先打开IIS功能: 为避免出现未知的麻烦,建议将IIS下的所有项都勾上: 创建IIS桌面快捷方式: 添加网站托管: ...

  8. python【1】-基础知识

    1.简介 python是一种解释性的.面向对象的.带有动态语义的高级程序设计语言. 廖雪峰网站:http://www.liaoxuefeng.com/wiki/001374738125095c955c ...

  9. localStorage存的值如果有true,false,需要注意了。

    把一个全局变量存到localStorage里面 isSupport是 true  false; window.localStorage && window.localStorage.s ...

  10. PHP 文件包含总结 include require 命名空间 autoload spl_autoload_register 读取文件路径

    总结: 1. include或require包含其他文件 使用./或者 ../,这里的当前路径和上一层路径,取决于运行脚本的路径,会存在如下问题. 在写PHP程序时,经常要用到include或requ ...