jQuery标签编辑插件Tagit用户指南

一、Tagit插件功能

提高网站互动性，增加用户体验。至于其他功能，真的没有。您可以用输入文本替换它。但是文本没有输入提示功能，tagit有这个功能。官方示例如下：

将关键词标记为一个整体。易于删除和浏览。

二.Tagit官方地址

有说明和例子的http://aehlke.github.io/tag-it/.官方地址配色的用例也可以选择。然而，这些都是选择。Tagit插件使用jqueryui，所以jqueryui提供的样式是兼容的。Jqueryui也是jQuery的一个插件，它提供了非常实用的接口元素。Jqueryui也提供了一些风格供我们选择，但是只选择了那些。我想修改一些点，但是我发现很难修改一些元素的样式。我换了一个地方，不经意间换了其他地方。有些地方也有免费风格的jqueryui插件，当然也有收费的。tagit插件jqueryui的扩展。

修改tagit样式更容易。在测试中，我将简单地修改tagit样式，只是展示如何修改它。修改样式的方法有很多，这只是其中一种。

Tagit支持事件操作，如编辑前、编辑后、删除前、删除后触发事件。

三.如何使用Tagit

Tagit很容易使用，但是有很多被引用的文件。因为Tagit是jqueryui的扩展，所以我们不仅要参考jquery，还要参考jqueryui及其风格。然后加上自己。1.参考文件

Script src=' http : jquery . js ' type=' text/JavaScript '/Script Script src=' http : jquery-ui . js ' type=' text/JavaScript '/Script src=' http : tag-it . js ' type=' text/JavaScript '/Script link rel='样式表' type=' text/CSS ' href=' jquery-ui . CSS ' link href=' jquery . tag . CSS。

#容器{ width:400px} input[type=submit]{ padd :8 px；}/*定义边框*/# single field tags { border :1 pxsolid # b1c 9dc；背景技术# e7e3ca}/*定义输入元素文本*/# singlefield标记输入{ background: # e7e3ca颜色：蓝色；}/*定义标签样式*/# singlefield tags Li { Background : # E7E3C A；border:1px固体# 930；color:red}/*第一个输入元素的父元素*/# single field tags . tag-new { border : none；}3.js代码

$(function(){var sampleTags=['c '，' java '，' php '，' coldfusion '，' javascript '，' asp '，' ruby '，' python '，' c '，' scala '，' groovy '，' haskell '，' perl '，' erlang '，' apl '，' cobol '，' go '，' Lua ']；$('#myTags ')。tagit({singleField: true，single field node : $(' # myTagsValues ')})；$ ('# singlefield标记')。tagit({//input prompt available tags : sample tags，//singlefield : true和allowspaces : true与赋值操作有关，tag中是否允许space singlefield节点3360 $(' # MysingleField ')//将值保存到mysing $('#submit1 ')。单击(function(){ alert($(' # myTagsValues '))。val())；});$('#submit2 ')。单击(function(){ alert($(' # MySingleField ')。val())；});});4.使用的html

div id=' container ' p ' PS test case 1/pulid=' my tags '/ul input type=' hidden ' id=' mytagsvalues '/input type=' submit ' value=' get input information ' id=' submit 1 '/PS test case 2/pp binding默认关键字，添加关键字时允许空格/PP修改样式/pulid=' single field tags '/uliput name=' tags ' id=' mysingefield ' value=' csharp，Jquery ' disabled=' true ' br/input type='