没有jQuery的OnClick

如何在没有 jQuery的情况下进行onclick 而不需要额外的HTML代码,比如:

 <a href="#" onclick="tramtramtram"> 

只是使用外部的js文件?

 <script type="text/javascript" src="functions.js"></script> 

我需要replace这个代码:

 $("a.scroll-up, a.scroll-down").click(function(){ SNavigate($(this).attr("href").substr(7));return false; }); 

当这个锚点只包含一个函数来处理点击时,你可以写出来

 document.getElementById('anchorID').onclick=function(){/* some code */} 

否则,你必须使用DOM方法addEventListener

 function clickHandler(){ /* some code */ } var anchor = document.getElementById('anchorID'); if(anchor.addEventListener) // DOM method anchor.addEventListener('click', clickHandler, false); else if(anchor.attachEvent) // this is for IE, because it doesn't support addEventListener anchor.attachEvent('onclick', function(){ return clickHandler.apply(anchor, [window.event]}); // this strange part for making the keyword 'this' indicate the clicked anchor 

当所有的元素都被加载的时候,还要记得调用上面的代码(比如window.onload)

– 编辑

我看到你添加了一些细节。 如果你想replace下面的代码

 $("a.scroll-up, a.scroll-down").click(function(){SNavigate($(this).attr("href").substr(7));return false;}); 

与不使用jQuery的东西,这应该做的工作

 function addEvent(obj, type, fn) { if (obj.addEventListener) obj.addEventListener(type, fn, false); else if (obj.attachEvent) obj.attachEvent('on' + type, function() { return fn.apply(obj, [window.event]);}); } addEvent(window, 'load', function(){ for(var i=0, a=document.anchors, l=a.length; i<l;++i){ if(a[i].className == 'scroll-up' || a[i].className == 'scroll-down'){ addEvent(a[i], 'click', function(e){ SNavigate(this.href.substr(7)); e.returnValue=false; if(e.preventDefault)e.preventDefault();return false}); } } }); 

这个怎么样 :

 document.getElementById("lady").onclick = function () {alert('onclick');}; 

W3Cbuild议:

 element.addEventListener('click',doSomething,false) 

微软使用:

 element.attachEvent('onclick',doSomething) 

您可以执行一些function检测并确定使用哪个呼叫。

http://www.quirksmode.org/js/events_advanced.html

 <script> function tramtramtram(){ alert("tram it!"); } </script> <a href="#" onclick="tramtramtram()">tramtram</a> 

在html中没有额外的代码,这是一个办法:

 <html><body><head><script> // This script could be in an external JS file function my_handler(elt) { alert("Yay!"); return false; } function setup() { document.getElementById('lady').onclick = my_handler; } window.onload = setup; </script></head> <body><a href='#' id='lady'>Test</a></body> </html> 

var el = document.getElementById('lady'); el.addEventListener(“click”,tramtramtram,false);

加载文档时执行此脚本(用您的东西replace警报):

 var rgLinks = document.getElementsByTagName("A"); for (var x=0; x<rgLinks.length; x++) { el = rgLinks[x]; if (el.className == 'scroll-down' || el.className == 'scroll-down') { el.onclick = function () {alert('onclick');}; } } 

也许这就是你在问什么…

只需使用onclick属性即可。

 <a href="#" onclick="functionName(someParam)"> 

或从JavaScript做到这一点,

 document.getElementById("anchorID").onclick = function(){ some code }; 

您需要使用getElementById来添加onclick处理程序。 但是你需要在某处启动你的代码。 没有jQuery,你只能使用body加载处理程序:

 <body onload="myinitfunction()"> 

myinitfunction可以在一个外部的js文件中。