首先非常感谢网友信的无私分享，这是他分享到JquerySchool网站上的第一款作品，用jquery实现了标签自动补全特效，功能代码很简单，非常实用。
包括了以下功能
1、与后台交互生成自动补全交互；
2、按回车自动完成；
3、点击选中标签提示删除；
4、遇到重复标签会自动提示（带动画闪烁效果）。。。
核心功能代码如下：
jQuery(document).ready(function () {
$('#tags').tagHandler({
assignedTags: arr, //原有标签,若没有，可以直接写 []
availableTags: ['动漫', '音乐'],//用于自动补全的数据，可从后台获取
autocomplete: true, //自动补全功能，true为有提示，false则反之
onAdd: function (tag) {
var addflag = true, tags = $('#tags').tagHandler("getTags");
jQuery.each(tags, function (i, e) {
if (tag.toUpperCase() === e.toUpperCase()) {
$('#tags').find('.tagItem').each(function () {
if ($(this).html().toLocaleUpperCase() === tag.toLocaleUpperCase()) {
$(this).animate({ opacity: 0.55 }).delay(20).animate({ opacity: 1 }).animate({ opacity: 0.55 }).delay(20).animate({ opacity: 1 });
}
});
addflag = false;
}
});
return addflag;
}
,
onDelete: function (tag) { //删除操作
var addflag = false;
var answer = confirm("您确定删除此标签？");
if (answer) {
addflag = true;
}
return addflag;
}
});
});
效果如下：
如果您觉得本作品对您的学习有所帮助：
关键字：
网友信 关键字 自动补全 TagsGroup 关键字组合