利用jQuery實現網站評論文本框表情選擇代碼



54 213 72



特效描述:利用jQuery實現 網站評論 文本框 表情選擇,利用jQuery實現網站評論文本框表情選擇代碼

代碼結構

1. 引入CSS

<link href="css/smohan.face.css" type="text/css" rel="stylesheet">

2. 引入JS

<script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/smohan.face.js" charset="utf-8"></script>

3. HTML代碼

<h3>文本框評論表情插件</h3>
<!--DEMO-->
<!--表情盒子-->
<div id="Smohan_FaceBox">
   <textarea name="text" id="Smohan_text" class="smohan_text"></textarea>
   <p>
   <a href="javascript:void(0)" class="face" title="表情"></a>
   <button class="button" id="Smohan_Showface">顯示表情</button>
   </p>
</div>
<!--/表情盒子-->
<!--解析表情-->
<div id="Zones"></div>
<!--/DEMO-->
<script type="text/javascript">
$(function (){
	$("a.face").smohanfacebox({
		Event : "click",	//觸發事件	
		divid : "Smohan_FaceBox", //外層DIV ID
		textid : "Smohan_text" //文本框 ID
	});
	//解析表情  $('#Zones').replaceface($('#Zones').html());
});
//Demo測試
$('#Smohan_Showface').click(function() {
	 $('#Zones').fadeIn(360);
	 $('#Zones').html($('#Smohan_text').val());
	 $('#Zones').replaceface($('#Zones').html());//替換表情
	});
</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 彈出層拖動 窗口 彈出 彈窗 彈出層 提示框 對話框 遮罩 遮罩層 彈窗插件 滑動星星打分 切換按鈕 表單 表單美化 表單插件 表單美化插件 其他 文本框 text文本框 Tooltip工具提示框 表情 qq表情 表情插件
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子