不明連結警告

在留言版功能已經上線之後,卻發現有必要在頁面當中,加上能夠警告使用者請勿連結到不明網址的功能,而我們不太希望用以前那種網頁一載入就跳出警告的擾民方式來提醒使用者,而是希望當他們按下連結以後才會跳出警訊警告他們,唯有當使用者按下確定連結之後才會連到該網站。其實,如果在寫入資料庫前就判斷這個連結是否是不明的外部連結並且把javascript加入語法,其實也是個十分容易的方法,不過很遺憾,當我準備要做這樣的功能時,就已經有一托拉庫的資料在資料庫當中了。

Anyway,我實在很懶得去碰那些資料,所以想要用更簡單的方式來解決我的問題。

其實程式本身並不難,但是因為我有點接近Javascript白痴,所以很費了我一些時間來處理,因為它還牽涉到跨瀏覽器的問題,如果想要使用的話,記得要把它放在網頁的最下方,因為他一定要等到網頁所有的元素都讀取完畢以後,才能夠抓到連結的網址,放在最上面,是不會有任何用處滴!

基本上,這支程式已經排除了 javascript:; 及 # 連結的網址,並且把允許的網址關鍵字放在陣列當中,因此在使用上並不會有太大的困難,以下就是這支程式,有需要的人就拿去用吧!


  var link = document.getElementsByTagName("A") ; 
  var allowKey = Array(/yahoo/,/wordpress/); //允許關鍵字的正規表示式 
  function chklink(obj){ 
    for(j=0; j<allowKey.length; j++){ 
      r = obj.search(allowKey[j]); 
      if(r > 0) return false; 
    } 
  } 

  for(i=0; i<link.length; i++){ 
    if(chklink(link[i].href)!=false && link[i].href!='javascript:;' && link[i].href!='#'){ 
      addEvent(link[i],"click", te ,false); 
    } 
  } 

  function te(e){ 
    var node = (window.document.all) ? event.srcElement : e.target; 
    var msg  = "您即將開啟下列連結,確定嗎?【 "+ node.href +" 】"; 
    if(!confirm(msg)){ 
      if(window.event) { 
        window.event.returnValue = false; 
      } else { 
	e.preventDefault(); 
      } 
      return false; 
    } 
  } 

  function addEvent(obj, evType, fn, useCapture){ 
    if (window.document.all){ 
      obj.attachEvent("on"+evType, fn); 
    } else { 
      obj.addEventListener(evType, fn, useCapture); 
    } 
  } 
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s