0

使用以下代码:

<head>
<script type="text/javascript">
function popupMsg(msg) { 
  alert(msg);
}
</script>
</head>

<body>
<a href="http://www.xyz.com" onClick="popupMsg('This is pop up message')">xyz.com</a>
</body>

如何在锚标签内onClick替换?addEventListener

可以在分配ID锚标记的情况下完成吗?

大概是这样的:

<a href="http://www.xyz.com" something.addEventListener('click',popupMsg(SomeMsg),false)>xyz.com</a>
4

3 回答 3

0

我不相信它以这种方式得到支持。您也许可以尝试 onload 处理程序:

<a href="" onLoad="(function(){ this.addEventListener("click", "fnName", false); })();">Link</a>

上面的代码未经测试。

于 2012-04-10T10:06:34.063 回答
0

您可以使用 querySelector(在现代浏览器中)来选择元素:

var anchor = document.querySelector('a')

(这应该选择页面上的第一个链接)

然后附上您的活动:

anchor.addEventListener( ... );

这些都不是在元素上内联完成的,这可以说是更好的......

所以像:

    <script>
    // Function to add event listener to the anchor  
    function load() {   
       var anchor = document.querySelector('a')  
       anchor.addEventListener( ... );
     }  

    document.addEventListener("DOMContentLoaded", load, false);  

  </script>
于 2012-04-10T10:08:17.013 回答
0

浏览器支持不同“级别”的事件附加,这是 W3C 随着时间的推移设置的标准。通过 DOM 中的“onclick”直接附加事件(即<a href="#" onclick="myFunction()">级别 0,或使用 JavaScript 执行相同操作(即:)document.getElementsByTagName('a')[0].onclick = myFunction;是级别 1。

级别 0 和级别 1 的限制是对于任何一种类型的事件,在任何时候只能将一个事件处理程序附加到每个单独的元素。为了使事件附加更加灵活,第 2 级事件允许为每个元素上的每种类型的事件提供多个事件处理程序,并且附加了document.getElementsByTagName('a')[0].addEventListener('click', myFunction, true).

在两者之间切换的有用指南位​​于http://jupiterjs.com/news/a-crash-course-in-how-dom-events-work

如果您不想将 ID 添加到元素以附加事件处理程序,jQuery 是一个库,它使使用 CSS 选择器查询 DOM 变得非常简单(上面的代码将变为jQuery('a').click(myFunction)) - 更多信息位于http://jquery.com

于 2012-04-10T10:15:32.713 回答