先在網(wǎng)上找到附件中的素材和部分源碼,在稍加改造即可應(yīng)用于評(píng)論框或者留言框旁邊
下面代碼和網(wǎng)上下載的素材是不一樣的,素材中的是html控件,而下面則改成了服務(wù)器控件(為了能在后臺(tái)獲取文本框的值),先上代碼,改動(dòng)說明下面再說:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test2.aspx.cs" Inherits="common_test2" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!--創(chuàng)建時(shí)間:08/25/2010 22:07:24說明:--><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"><title>無標(biāo)題頁</title></head><body><form id="form1" runat="server"><div class="team_l"><asp:TextBox ID="txtname" runat="server" Height="106px" TextMode="MultiLine"Width="182px" onkeydown=gbcount(this.form.gb_word,this.form.total,this.form.used,this.form.remain); onkeyup=gbcount(this.form.gb_word,this.form.total,this.form.used,this.form.remain);></asp:TextBox><br /><div class="team_r" style="width:380px"><p><img src="../images/1.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[-_-] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/2.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[@o@] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/3.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[-|-] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/4.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[o_o] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/5.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[ToT] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/6.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[*_*] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/7.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[-x-] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/8.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[-_-zz] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/9.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[t_t] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/10.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[-_-!] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/11.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:,] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/12.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:P] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/13.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:D] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/14.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:)] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/15.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:(] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/16.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:O] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/17.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:#] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/18.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:Z] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/19.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:0=] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/20.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[/:P] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/21.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:$] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/22.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[-.-] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/23.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[/-_-] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/24.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:{] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/25.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[zz] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/26.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[|-_-|] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/27.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[-_-||] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/28.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:.] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/29.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:-Q] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/30.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[9_9] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/31.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:,.] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/32.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:?] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/33.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:-|] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/34.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:K] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/35.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:G] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/36.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:L] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/37.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:c] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/38.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:q] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/39.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[:Y] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/40.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[/gs] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/41.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[/sg] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/42.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[/hp] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/43.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[/ok] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/44.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[/rain] ';document.getElementById('txtname').focus()" style="cursor:hand"><img src="../images/45.gif" width="20" height="20" onClick="document.getElementById('txtname').value+='[/yin] ';document.getElementById('txtname').focus()" style="cursor:hand"></p></div><input type="reset" name="Submit2" value="重置"><asp:Button ID="submit" runat="server" Text="提交" OnClick="submit_Click" /><img src='../images/23.gif' width='20' height='20'/></div></form></body></html>
原素材是獲取name,而服務(wù)器控件沒有name,故我們改成獲取id
即將onClick="document.forms[0].gb_word.value(這句看不懂沒有關(guān)系,是素材中的)改成
onClick="document.getElementById('txtname').value
注:txtname為文本框的id值
這樣就能在.cs文件中能取得文本框的值,從而添加到數(shù)據(jù)庫中
注:服務(wù)器控件的id轉(zhuǎn)成html的id后是一段很長(zhǎng)的字符串,如果上面改動(dòng)不能用,就把txtname改成對(duì)應(yīng)生成的html頁面的id即可
到此為止,展示頁面的代碼就改完了,接下來在后面進(jìn)行處理,主要用到了replace(用法在網(wǎng)上搜一下就知道了,非常好用的)函數(shù)。
符號(hào)裝成圖片的方法
public string PictureSwap(string str){string[] a = new string[] { "[-_-]", "[@o@]", "[-|-]", "[o_o]", "[ToT]", "[*_*]", "[-x-]", "[-_-zz]", "[t_t]", "[-_-!]", "[:,]", "[:P]", "[:D]", "[:)]", "[:(]", "[:O]", "[:#]", "[:Z]", "[:0=]", "[/:P]", "[:$]", "[-.-]", "[/-_-]", "[:{]", "[zz]", "[|-_-|]", "[-_-||]", "[:.]", "[:-Q]", "[9_9]", "[:,.]", "[:?]", "[:-|]", "[:K]", "[:G]", "[:L]", "[:c]", "[:q]", "[:Y]", "[/gs]", "[/sg]", "[/hp]", "[/ok]", "[/rain]", "[/yin]" };for (int i = 1; i <= 45; i++){str = str.Replace(a[i - 1], "<img src='../images/" + i + ".gif' width='20' height='20'/>");}Response.Write(str + "asadadadad<br/>");return str;}
參數(shù)str為要要轉(zhuǎn)換的文字,比如說是整個(gè)留言的內(nèi)容(其中加有類似([-|-])的符號(hào))
用到了數(shù)組跟循環(huán),也不太難就不說了
調(diào)用方法
string s = PictureSwap(txtname.Text.toString());
s即為轉(zhuǎn)換后的能顯示圖片的字符串
顯示時(shí)有兩種處理方式:
1.在存入數(shù)據(jù)庫之前調(diào)用PictureSwap改變成圖片地址
2、取出數(shù)據(jù)時(shí)調(diào)用PictureSwap轉(zhuǎn)換成圖片顯示
這就看個(gè)人愛好,也看是哪一個(gè)使用頻繁咯。
聯(lián)系客服