表单/表格
简单jQuery标签插件sTags
PetitQ
sTags 是一款 jQuery 标签插件。该插件可以生成不同颜色的标签，可以对标签进行搜索过滤，添加和删除等。
使用方法
在页面中引入 jquery.sTags.css，jquery 和 jquery.sTags.js。
也想出现在这里？联系我们吧
<link rel="stylesheet" href="jquery.sTags.css">
<script src="jquery.min.js"></script>
<script src="jquery.sTags.js"></script>
HTML 结构
可以使用 input 或 div 来作为标签的容器。
<input type="text" id="DemoInput">
<div id="DemoDiv"></div>
CSS 样式
.sTags-input{border: 1px solid #ccc;
height: 100px;
}.sTags-input>div{
display: inline-block;
padding: 5px 5px 5px 12px;
margin: 2px;
border-radius: 2px;
}.sTags-input>div>a{
display: inline-block;
margin: 0 7px;
color: #ddd;
cursor: pointer;
}.sTags{margin: 10px 0;
}.sTags-old{color: #fff;
background: #A2A;
}.sTags-new{color: #fff;
background: #A2CD5A;
}.sTags>div,
.sTags>a{
cursor: pointer;
display: inline-block;
padding: 5px 12px;
margin: 2px;
border-radius: 2px;
color: #fff;
background: #A2CD5A;
}
初始化插件
$("#DemoInput").sTags({
data:TagsData,
})
$("#DemoDiv").sTags({
data:TagsData,
click:function(e){
alert(e.attr("tagid"))
},
})
Github 网址：https://github.com/28269890/sTags
| 演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！
也想出现在这里？联系我们吧
