基于jquery的點擊鏈接插入鏈接內(nèi)容的代碼
更新時間：2012年07月31日 23:04:48 作者：
基于jquery的點擊鏈接插入鏈接內(nèi)容的代碼，感覺有bug，解決的朋友可以留言方便更多的朋友
點擊鏈接插入鏈接內(nèi)容。
亮點：
1.正則匹配<a>標(biāo)記。
2.jQuery單擊添加，雙擊刪除。
3.textarea加入換行。
核心代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Click to Text</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<script type="text/javascript" src="http://demo.jb51.net/jslib/jquery/jquery-1.6.2.min.js"></script>
</head>
<body>
<div id="clickContain">
<a href="http://www.dbjr.com.cn">腳本之家</a>
<a >百度</a>
<a >QQ</a>
<a >新浪</a>
<a >abc</a>
</div>
<div id="textContain">
<textarea rows="10" cols="50"></textarea>
</div>
<script type="text/javascript">
$(document).ready(function(){
var textareaContain = $("#textContain textarea").eq(0);
//單擊插入鏈接
$("#clickContain a").click(function(){
if(!$(this).hasClass('lock')) {
var p = eval('/<a(?:.*)'+$(this).html()+'(?:.*)a>/i');
var addString = $(this).parent().html().match(p); //正則提取<a>標(biāo)簽
if(!!addString) addString = addString[0]+'\n'; //正則匹配后的[0]是全部匹配的值，加入換行\(zhòng)n
textareaContain.val(textareaContain.val()+addString);
$(this).addClass('lock'); //阻止第二次點擊
}
return false;
});
//雙擊刪除鏈接
$("#clickContain a").dblclick(function(){
$(this).attr('class',null); //刪除整個class屬性，以免出現(xiàn)class=""
var p = eval('/<a(?:.*)'+$(this).html()+'(?:.*)a>(\\n*)/gi');
textareaContain.val(textareaContain.val().replace(p,''));
return false;
});
});
</script>
</body>
</html>
作者：Zjmainstay
出處：http://www.cnblogs.com/Zjmainstay/
亮點：
1.正則匹配<a>標(biāo)記。
2.jQuery單擊添加，雙擊刪除。
3.textarea加入換行。
核心代碼：
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Click to Text</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<script type="text/javascript" src="http://demo.jb51.net/jslib/jquery/jquery-1.6.2.min.js"></script>
</head>
<body>
<div id="clickContain">
<a href="http://www.dbjr.com.cn">腳本之家</a>
<a >百度</a>
<a >QQ</a>
<a >新浪</a>
<a >abc</a>
</div>
<div id="textContain">
<textarea rows="10" cols="50"></textarea>
</div>
<script type="text/javascript">
$(document).ready(function(){
var textareaContain = $("#textContain textarea").eq(0);
//單擊插入鏈接
$("#clickContain a").click(function(){
if(!$(this).hasClass('lock')) {
var p = eval('/<a(?:.*)'+$(this).html()+'(?:.*)a>/i');
var addString = $(this).parent().html().match(p); //正則提取<a>標(biāo)簽
if(!!addString) addString = addString[0]+'\n'; //正則匹配后的[0]是全部匹配的值，加入換行\(zhòng)n
textareaContain.val(textareaContain.val()+addString);
$(this).addClass('lock'); //阻止第二次點擊
}
return false;
});
//雙擊刪除鏈接
$("#clickContain a").dblclick(function(){
$(this).attr('class',null); //刪除整個class屬性，以免出現(xiàn)class=""
var p = eval('/<a(?:.*)'+$(this).html()+'(?:.*)a>(\\n*)/gi');
textareaContain.val(textareaContain.val().replace(p,''));
return false;
});
});
</script>
</body>
</html>
作者：Zjmainstay
出處：http://www.cnblogs.com/Zjmainstay/
相關(guān)文章
jquery 獲取 outerHtml 包含當(dāng)前節(jié)點本身的代碼
jQuery.html() 是獲取當(dāng)前節(jié)點下的html代碼，并不包含當(dāng)前節(jié)點本身的代碼，后來實驗發(fā)現(xiàn)有一個jQuery的一個方法可以解決2014-10-10
Jquery使用each函數(shù)實現(xiàn)遍歷及數(shù)組處理
這篇文章主要介紹了Jquery使用each函數(shù)實現(xiàn)遍歷及數(shù)組處理,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-07-07
使用jQuery.form.js/springmvc框架實現(xiàn)文件上傳功能
這篇文章主要介紹了使用jQuery.form.js/springmvc框架實現(xiàn)文件上傳功能，非常具有參考借鑒價值，感興趣的朋友一起學(xué)習(xí)吧2016-05-05
qTip2是一個灰常強大且精致的jQuery提示信息插件，是qTip的第2版，也是一個全新的版本，提供了豐富的功能及漂亮的外觀，非常易于使用2012-02-02
這篇文章主要為大家詳細(xì)介紹了jquery實現(xiàn)動態(tài)添加附件功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-10-10
這篇文章主要介紹了通過Ajax使用FormData對象無刷新上傳文件方法，具有一定的參考價值，感興趣的朋友可以了解一下。2016-12-12
這篇文章主要為大家分享了適應(yīng)手機端的jQuery圖片滑塊動畫,不僅在PC瀏覽器上可以使用，而且更適合在手機端的網(wǎng)頁中使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12
jQuery憑借其簡潔的API，對DOM強大的操控性，易擴展性越來越受到web開發(fā)人員的喜愛，經(jīng)常有人詢問一些技巧，因此干脆寫這么一篇文章給各位jQuery愛好者，算是拋磚引玉吧。2014-11-11
使用jquery獲取url以及jquery獲取url參數(shù)的實現(xiàn)方法
下面小編就為大家?guī)硪黄褂胘query獲取url以及jquery獲取url參數(shù)的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
本文給大家分享的是jQuery中的end()的定義和使用方法及示例，非常簡單實用，有需要的小伙伴可以參考下。2015-07-07