热门关键字:
jquery > jquery插件 > jquery文本框特效 > 网友姚航分享原创Jquery实现标签自动完成特效

网友姚航分享原创Jquery实现标签自动完成特效

6239
所属分类:jquery文本框特效
发布时间:2013/5/27 15:16:51
下载量:1116
评论数:1
转载请自觉注明原文:http://www.jq-school.com/Detail.aspx?id=232

首先非常感谢网友姚航的无私分享,此作品是他刚写好的一个Jquery特效,虽然很简单,很非常实用,实现标签按空格或逗号自动完成,应用场景很广,现在很多网站平台的标签模块功能都是输入之后按空格或指的键后都自动完成添加或删除。


这是作品的最初版本,大家有什么问题都可以反馈,样式可以自定义,主要是实现了功能,大家好好利用哦。


包括了以下功能:

1、自动生成标签

2、按空格自动完成

3、按逗号自动完成

4、点击标签右上角叉叉删除

5、按退格键自动往前面删除标签


修正Bug:

版本:V1.0.1

时间:2013-05-27

内容:修复点击div时无法聚焦到文本框的bug


原创作者信息:

联系人:姚航
联系电话:15026608941
联系QQ:496591758
联系Email:yaohang405@sina.cn


核心代码如下:


/*
动态生成标签
**/
function createTag(val){
   var $lab=$("<div id='lab'>"+val+"<a href='javascript:void(0)'  title='删除'>×</a></div>");
   $lab.children("a").each(function(){   
		   $(this).bind("click",function(){
			   $(this).parent().remove();
			   $(tabMsg).html("");
		   });
   });
   $div.prepend($lab);
   var $txt=$(tabTxt);
   if($txt.val()==null||$.trim($txt.val())==""){
	   $txt.val(val);
   }else{
		$txt.val($txt.val()+","+val);
   }	
   $text.val("");
}


效果如下:

网友姚航分享Jquery实现标签按空格或逗号自动完成特效






如果您觉得本作品对您的学习有所帮助:支付鼓励



关键字:网友姚航 文字特效 自动补全 标签自动完成 关键字 实用特效
  • 网友姚航分享原创Jquery实现标签自动完成特效如果你喜欢学院的资源就下载吧,亲,谢谢!
  • 网友姚航分享原创Jquery实现标签自动完成特效
  • 网友姚航分享原创Jquery实现标签自动完成特效
  • 提示:如果网络问题无法下载,请多尝试几次,与 网站管理员联系 或 本站留言 !

声明: 本站内容均为网友原创或整理于互联网,版权归作品最初创作人,转载请注明(出处)原文链接,转载前请邮件至磐temdy@qq.com,一旦发现造成侵权行为,后果自负。。

友荐云推荐