Heim > Artikel > Backend-Entwicklung > 请教这种添加‘热门标签’的插件是什么?如下图所示。
不知道这种插件,我自己用jquery写过类似的
不知道这种插件,我自己用jquery写过类似的
这个比较杂,搜索的时候用到了autocomplete,样式就自己写
$("#ask-search-tag").autocomplete(wd_gettagUrl,{ matchContains:true, delay:500, cacheLength:100, matchSubset:true, minChars:1, width:250, max:20, extraParams:{type:'fastask'}, scrollHeight:500, parse: function(data){ return $.map(eval(data), function(row) { return { data: row, value: row.tagname, result: row.id, result1:row.fave_count, result2:row.tagimg } }); }, formatItem: function(row, i, max){ if(row.id==0){ return '<span>创建 '+row.tagname+' 话题</span>'; } if(row.id==-1){ return '<span>'+row.tagname+' 正在审核</span>'; } if(row.id==-2){ return '<span>请使用已存在的话题</span>'; } return '<img style="max-width:90%" style="max-width:90%" src="'+row.tagimg+'"/ alt="请教这种添加‘热门标签’的插件是什么?如下图所示。" ><p>'+row.tagname+'</p>'; }}).result(fastaskaddtag);var addid=1;function fastaskaddtag(event,item){ $("#ask-search-tag").val(''); if(item.id==-1 || item.id==-2){ return false; } var err_tag=$('.err_tag'); err_tag.hide(); var tagcount=$("#ask-tags-item div").length; if(tagcount>=5){ err_tag.text('最多添加五个话题').show(); $("#ask-search-tag").hide(); return false; } var exists=''; $('#ask-tags-item a[name=removetag]').each(function() { if(item.id==$(this).attr('data') && item.id!=0){ exists=1; } }) $('#ask-tags-item span').each(function() { if(item.tagname==$(this).text()){ exists=1; } }) if(exists==1){ err_tag.text('已添加过该话题').show(); return false; } var length=mb_strlen(item.tagname); var sublen=Math.ceil(length/2); if(sublen>25){ err_tag.text('话题长度只能是50个字符或25个汉字').show(); return false; } var addstatus=1; var addmsg=''; if(item.id==0){ $.ajax({ type:'post', url:wd_AddTagBySearchUrl, async:false, data:{ tagname:item.tagname }, success:function(res){ res=eval("("+res+")"); addstatus=res['status']; addmsg=res['msg']; item.id=res['msg']; } }); } if(addstatus==0){ if(addmsg=='login'){ showLogin(); }else{ $('.err_tag').text(addmsg); $('.err_tag').show(); $("#ask-search-tag").flushCache(); } return false; } var addhtml='<div><span>'+item.tagname+'</span><a href="javascript:;" data='+item.id+' class="t_rem" name="removetag"></a></div>'; $("#ask-tags-item").append(addhtml); if((tagcount+1)==5){ $("#ask-search-tag").hide(); } $("#ask-tags-item a[name=removetag]").unbind('click').click(function(){ removetag($(this)); })}