js鏈接確認提醒功能

更新時間：2008年09月04日 13:47:04 作者：

非常不錯的功能，當單機一個鏈接時，會彈出確認對話框效果

<html> 
<head> 
<script type="text/javascript"> 
function S(i){return document.getElementById(i)} 
function copyUrl(){//復制網(wǎng)址 
  var clipBoardContent=S("downloadDirect").href; 
try{ 
window.clipboardData.setData("Text",clipBoardContent); 
alert("復制成功!"); 
}catch(e){ 
alert("復制失敗!"); 
} 
} 
document.onclick = function(evt){//在不是連接的位置單擊時,隱藏 顯示的層 
  var _target = evt ? evt.target : event.srcElement ; 
  var _id = _target.id; 
  if( _id == "" ){ 
    _id = _target.tagName; 
  } 
  if( _id !="A"){ 
    S("downloadPanel").style.display = 'none'; 
  } 
} 
window.onload=function(){//網(wǎng)頁載入時,綁定指定對象下的所有a 
var xx=S("xx"); 
var xxx = xx.getElementsByTagName("a"); 
for(var i=0,j=xxx.length; i<j; i++){ 
xxx[i].onclick=function(evt){ 
var _event = evt ? evt : window.event; 
var _target = evt ? evt.target : window.event.srcElement; 
var _p = S("downloadPanel"); 
_p.style.top = _event.clientY + document.body.scrollTop ; 
_p.style.left = ( _event.clientX + document.body.scrollLeft < 160 ? _event.clientX + document.body.scrollLeft + 10 : _event.clientX + document.body.scrollLeft - 120 ); 
S("downloadPanel").style.display = ''; 
S("downloadDirect").href= this.href; 
return false; 
} 
} 
} 
</script> 
<style type="text/css"> 
html,body{ font-size:12px;} 
a {color:#4d5d2c;text-decoration:underline;cursor:pointer;} 
.pointer {cursor:pointer;} 
.infobar {background:#fff9e3;border:1px solid #fadc80;color:#743e04;margin-bottom:10px;padding:8px 20px 4px 20px;} 
</style> 
</head> 
<body> 
<div   class="kg1wrxl"   id="downloadPanel" style="position:absolute;top:0px;left:0px;width:160px;z-index:999;padding:6px 2px 6px 10px;border:1px solid #fb7;display:none;" class="infobar"> 
<div style="padding:3px 0 0 0;"><a id="downloadDirect" href="javascript:void(0);" target="_blank">打開網(wǎng)址</a>&nbsp;&nbsp;<a id="downloadAgent" href="javascript:void(0);" onclick="copyUrl()">復制</a>&nbsp;&nbsp;<a href="javascript:void(0)" onclick="S('downloadPanel').style.display = 'none';">關閉</a></div> 
</div> 
<div   class="th6dg9z"   id="xx"> 
<a >http://www.baidu.com</a> 
<a href=http://www.dhdzp.com>http://www.dhdzp.com</a> 
<a >http://www.163.com</a> 
<a >http://www.sina.com</a> 
<a >http://www.qq.com</a> 
</div> 
</body> 
</html>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁面才能執(zhí)行]

您可能感興趣的文章:

小程序?qū)崿F(xiàn)多選框功能
這篇文章主要為大家詳細介紹了小程序?qū)崿F(xiàn)多選框功能，小程序?qū)崿F(xiàn)單選全選多選刪除操作，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2018-10-10
js運動框架_包括圖片的淡入淡出效果
js運動框架_包括圖片的淡入淡出效果，需要的朋友可以參考一下
2013-05-05
微信小程序靜默登錄和維護自定義登錄態(tài)詳解
這篇文章主要給大家介紹了關于微信小程序靜默登錄和維護自定義登錄態(tài)的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2021-05-05
JavaScript刪除數(shù)組中指定元素5種方法例子
這篇文章主要給大家介紹了關于JavaScript刪除數(shù)組中指定元素5種方法,在最近的項目中,有用到js對數(shù)組的操作,所以這里總結一下,需要的朋友可以參考下
2023-07-07
微信小程序?qū)崿F(xiàn)聊天室功能
這篇文章主要為大家詳細介紹了微信小程序?qū)崿F(xiàn)聊天室功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2021-06-06
SOSO地圖API使用(一)在地圖上畫圓實現(xiàn)思路與代碼
最近在做SOSO地圖相關開發(fā)，遇到相關畫圓知識，特此簡單記錄下來,接下來講解如何在在地圖上畫圓，感興趣的朋友可以了解下
2013-01-01
JavaScript取得WEB安全顏色列表的方法
這篇文章主要介紹了JavaScript取得WEB安全顏色列表的方法,分析了web安全顏色的定義及javascript獲取web安全顏色的實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-07-07
用VsCode編輯TypeScript的實現(xiàn)方法
這篇文章主要介紹了用VsCode編輯TypeScript的實現(xiàn)方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2020-05-05
ES6入門教程之Class和Module詳解
這篇文章主要給大家介紹了ES6中Class和Module的相關資料，文中介紹的非常詳細，對大家具有一定的參考學習價值，需要的朋友們下面來一起看看吧。
2017-05-05
深入webpack打包原理及l(fā)oader和plugin的實現(xiàn)
這篇文章主要介紹了深入webpack打包原理及l(fā)oader和plugin的實現(xiàn)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2020-05-05