如何處理JavaScript中的點擊鏈接？

Question

如何處理沒有ID的鏈接？它只有一個類名，如「classbeauty」。

現在我需要知道用戶是否點擊了鏈接。 如果鏈接被點擊，我只需要撥打alert("yes link clicked");。

我不知道如何處理JavaScript中的事件。

我該怎麼做？

Answer 1

如果jQuery是一個選項：

$("a.classbeauty").click(function(){ 
    alert("yes link clicked"); 
}); 

如果您需要純JavaScript：

var elements = document.getElementsByTagName("a"); 
for(var i=0; i<elements.length; i++){ 
    if (elements[i].className == 'classbeauty') { 
     elements[i].onclick = function(){ 
      alert("yes link clicked!"); 
    } 
} 
} 

如果你需要它Greasemonkey：

function GM_wait() { 
    if(typeof unsafeWindow.jQuery != 'function') { 
     window.setTimeout(wait, 100); 
    } else {   
      unsafeWindow.jQuery('a.classbeauty').click(function(){ 
        alert('yes link clicked'); 
       }); 
    } 
} 
GM_wait(); 

Answer 2

function getElementsByClassName(class_name) { 
    var elements = document.getElementsByTagName('*'); 
    var found = []; 

    for (var i = 0; i < elements.length; i++) { 
     if (elements[i].className == class_name) { 
      found.push(elements[i]); 
     } 
    } 

    return found; 
} 

getElementsByClassName("YourClass")[0].onclick = function() { alert("clicked"); }; 

這是純順便說一下，JavaScript。這裏的每個人都喜歡jQuery（包括我）。

Answer 3

for (var i= document.links.length; i-->0;) { 
    if (document.links[i].className==='classbeauty') { 
     document.links[i].onclick= function() { 
      alert('yes link clicked'); 
      return false; // if you want to stop the link being followed 
     } 
    } 
} 

Answer 4

function handleLinks(className, disableHref) { 
    var links = document.body.getElementsByTagName("a"); 

    for (var i = 0; i < links.length; i++) { 
     if (links[i].className == className) { 
      links[i].onclick = function(){ 
       alert('test') 
       if (disableHref) { 
        return false; //the link does not follow 
       } 
      } 
     } 
    } 

} 

handleLinks('test', true) 

您可以在此鏈接測試： http://jsfiddle.net/e7rSb/

Answer 5

我不知道這是否是一種選擇，但我會翻轉標誌鏈接被點擊的時候，然後就測試該變量。

//javascript 
var _cbClicked = false; 
function checkClicked() { 
    if (_cbClicked) alert("link was clicked"); 
    return false; 
} 

//html 
<a href="#" class="classbeauty" onclick="_cbClicked = true; return false;">Link Text</a> 
<a href="#" onclick="checkClicked();">Check Link</a> 

很簡單，純JS :)

Answer 6

如果控制源代碼，你可以添加你的腳本嵌入。

<a onclick="alert('yes link clicked'); return false">Link</a> 

如果你的目標的現代瀏覽器，你可以用getElementsByClassName選擇元素。這裏有幾個人提出了他們自己的這個函數的實現。

var node = document.getElementsByClassName('classbeauty')[0] 
node.onclick = function(event){ 
    event.preventDefault() 
    alert("yes link clicked") 
}