基于jquery的點擊鏈接插入鏈接內(nèi)容的代碼
更新時間:2012年07月31日 23:04:48 作者:
基于jquery的點擊鏈接插入鏈接內(nèi)容的代碼,感覺有bug,解決的朋友可以留言方便更多的朋友
點擊鏈接插入鏈接內(nèi)容。
亮點:
1.正則匹配<a>標記。
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.dhdzp.com">腳本之家</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>標簽
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>標記。
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.dhdzp.com">腳本之家</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>標簽
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/
相關文章
jQuery中的read和JavaScript中的onload函數(shù)的區(qū)別
這篇文章主要介紹了jQuery中的read和JavaScript中的onload函數(shù)的區(qū)別,這兩個函數(shù)在web編程中是最常用的,一定要搞清楚它們的區(qū)別,需要的朋友可以參考下2014-08-08
jQuery lazyLoad圖片延遲加載插件的優(yōu)化改造方法分享
jQuery lazyLoad.js插件 是一款基于jquery框架,可以“實現(xiàn)”圖片延遲加載的插件2013-08-08
jQuery實現(xiàn)DIV響應鼠標滑過由下向上展開效果示例【測試可用】
這篇文章主要介紹了jQuery實現(xiàn)DIV響應鼠標滑過由下向上展開效果,涉及jQuery基于事件響應結合stop與animate方法控制頁面元素屬性動態(tài)變換相關操作技巧,需要的朋友可以參考下2018-04-04

