调用了一个朋友些的js库,准备有时间自己实现一遍。更改了表情解析的代码,有时间把表情生成那一块也改掉

/*
 @ 文本框插入表情插件
 @ 作者:水墨寒 Smohan.net
 @ 日期:2013年1月28日
*/

	$.fn.smohanfacebox = function(options) {
		var defaults = {
		Event : "click", //响应事件		
		divid : "Smohan_FaceBox", //表单ID(textarea外层ID)
		textid : "TextArea" //文本框ID
		};
		var options = $.extend(defaults,options);
		var $btn = $(this);//取得触发事件的ID
		
		//创建表情框
		var faceimg = \'\';
	    for(i=0; i < 60; i++){  //通过循环创建60个表情,可扩展
		 		faceimg+=\'<li><a href="javascript:void(0)"><img src="/frontEnd/images/face/\'+(i+1)+\'.gif" face="&\' + (i+1) + \',"/></a></li>\';
		 	};
		$("#"+options.divid).prepend("<div id=\'SmohanFaceBox\'><span class=\'Corner\'></span><div class=\'Content\'><h3><span>常用表情</span><a class=\'close\' title=\'关闭\'></a></h3><ul>"+faceimg+"</ul></div></div>");
	     $(\'#SmohanFaceBox\').css("display",\'none\');//创建完成后先将其隐藏
		//创建表情框结束
		
		var $facepic = $("#SmohanFaceBox li img");
		//BTN触发事件,显示或隐藏表情层
		$btn.live(options.Event,function(e) {
			if($(\'#SmohanFaceBox\').is(":hidden")){
			$(\'#SmohanFaceBox\').show(360);
			$btn.addClass(\'in\');
			}else{
			$(\'#SmohanFaceBox\').hide(360);
			$btn.removeClass(\'in\');
				}
			});
		//插入表情
		$facepic.die().click(function(){
		     $(\'#SmohanFaceBox\').hide(360);
			 //$("#"+options.textid).focus();
			 //$("#"+options.textid).val($("#"+options.textid).val()+$(this).attr("face"));
			 $("#"+options.textid).die().insertContent($(this).attr("face"));
			 $btn.removeClass(\'in\');
			});			
		//关闭表情层
		$(\'#SmohanFaceBox h3 a.close\').click(function() {
			$(\'#SmohanFaceBox\').hide(360);
			 $btn.removeClass(\'in\');
			});	
		//当鼠标移开时,隐藏表情层,如果不需要,可注释掉
		 $(\'#SmohanFaceBox\').mouseleave(function(){
			 $(\'#SmohanFaceBox\').hide(560);
			 $btn.removeClass(\'in\');
			 });	

  };  
  
  // 【漫画】 光标定位插件
	$.fn.extend({  
		insertContent : function(myValue, t) {  
			var $t = $(this)[0];  
			if (document.selection) {  
				this.focus();  
				var sel = document.selection.createRange();  
				sel.text = myValue;  
				this.focus();  
				sel.moveStart(\'character\', -l);  
				var wee = sel.text.length;  
				if (arguments.length == 2) {  
				var l = $t.value.length;  
				sel.moveEnd("character", wee + t);  
				t <= 0 ? sel.moveStart("character", wee - 2 * t	- myValue.length) : sel.moveStart("character", wee - t - myValue.length);  
				sel.select();  
				}  
			} else if ($t.selectionStart || $t.selectionStart == \'0\') {  
				var startPos = $t.selectionStart;  
				var endPos = $t.selectionEnd;  
				var scrollTop = $t.scrollTop;  
				$t.value = $t.value.substring(0, startPos) + myValue + $t.value.substring(endPos,$t.value.length);  
				this.focus();  
				$t.selectionStart = startPos + myValue.length;  
				$t.selectionEnd = startPos + myValue.length;  
				$t.scrollTop = scrollTop;  
				if (arguments.length == 2) { 
					$t.setSelectionRange(startPos - t,$t.selectionEnd + t);  
					this.focus(); 
				}  
			} else {                              
				this.value += myValue;                              
				this.focus();  
			}  
		}  
	});
 
 //表情解析
$.extend({
	replaceface : function(faces){
		//for(i=0;i<60;i++){ 源代码
			//faces=faces.replace(\'<emt>\'+ (i+1) +\'</emt>\',\'<img src="/frontEnd/images/face/\'+(i+1)+\'.gif">\');

		//}
		return faces.replace(/\&([0-9]+)\,/g, function (str,$0) { //修改后代码
			return \'<img src="/frontEnd/images/face/\'+ $0 +\'.gif">\';
		});
		 //$(this).html(faces);
			//return faces;
		 }
	});

版权声明:本文为clearfix原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://www.cnblogs.com/clearfix/p/5217888.html