作者jimshsu (jims)
看板Ajax
標題[問題] 請問如何讓圖形替換後的表情符號代碼被選取
時間Sat Feb 12 23:04:55 2011
原問題再WebDesign以CSS為主題發問,
不過最後似乎他牽扯到要JS才能達到
因此在此向各位請教,
要請教各位如何讓圖形替換後的表情符號代碼被選取
我想讓使用者輸入:
你好[:)]
然後呈現頁面時,系統會把[:)]會換成笑臉圖案的html語法,
但是我又希望他在網頁選取"你好[:)]"這段文字時(這時笑臉已經被換成圖形)
複製貼上的結果仍為"你好[:)]"
不知道是否有板友知道這樣的做法如何達成?
*******************************************
經過小弟測試的狀況如下
HTML檔:
<head>
<style type="text/css">
span.code {
background-position: 0px center;
background-repeat: no-repeat;
outline: none;
padding: 1px 0px 1px 14px;
background-image: url(smile.gif);
}
</style>
</head>
你好嗎?<span class="code" alt=":)"> </span>
***********************************************
"你好嗎?[:)]"用正規表示是可以取代成<span class="code" alt=":)"> </span>
但是網頁呈現出來後,文字選取無法得到"你好嗎?[:)]"
所以看來CSS只能做到如此了
--
1F：→ knives:bbcode ? 02/12 16:40
2F：→ jimshsu:bbcode是使用在編輯畫面,呈現時經由系統解譯成html, 02/12 16:49
3F：→ jimshsu:不過我希望是使用者再看別人文章內容時,選取文字能把[XX] 02/12 16:50
4F：→ jimshsu:的字串也帶走,因此想說是否能透過CSS控制 02/12 16:51
5F：推 ss163500:感覺要用jquery 02/12 18:24
6F：→ superpai:regex看到表情符號用span包住然後用css背景替換文字 02/12 18:55
7F：推 s25g5d4:所以還是要javascript 02/12 19:48
8F：→ s25g5d4:來AJAX版吧~~(招手 02/12 19:48
感謝!!!
※ 編輯: jimshsu 來自: 220.136.81.227 (02/12 23:09)
9F：推 wa120:用replace 02/13 00:16
10F：→ wa120:改成<span class="code">:)</span> 然後css文字顏色跟 02/13 00:22
11F：→ wa120:背景一樣~ 02/13 00:23
12F：推 dinos:span.code div {display:none;visibility:hidden;} 02/13 00:25
13F：→ dinos:<span class="code"><div>:)</div></span> 02/13 00:25
14F：→ chrisQQ:樓上應該沒辦法用選取複製了？ 02/13 09:10
15F：→ jimshsu:可以了~~~感謝wa120大與其他版眾幫忙!! 02/13 22:30