我应该使用在线或有线的事件处理程序

好了，这是首选/右或什么时候应该使用一个比其他，也带来的好处/缺点使用以下;我应该使用在线或有线的事件处理程序

<a href="#" id="hypMyLink" onClick="myFunc();">a link</a> 

<script> 
    function myFunc(){ 
     //do something 
    } 
</script>

或者......

<a href="#" id="hypMyLink">a link</a> 

<script> 
    $(function() { 
     $('#hypMyLink').click(function(e) { 
      //do something 
     });    
    }); 
</script>

提前感谢！

来源

2011-09-15 Dooie

在标记的一个完美的世界 - 所有的事情都是语义，你会单独您的标记，样式和JavaScript在各自的文件。

它只是让事情变得如此容易调试，并且在一个行业中，如果您经常知道您在寻找什么，无论是事件，样式还是标记，常常会更改。

为例：移动到CSS文件做所有我发现prethought增加了分离，你需要在以后的时间来选择你的元素的样式。

来源

2011-09-15 13:31:39 f0x

不显眼的（即没有嵌入在HTML标记的<script>标签外部的JavaScript）是要走的路。为什么？有几个原因：

它加强了关注点分离。为什么你的HTML关心行为？

它使优雅降级/渐进增强可能。您可以根据用户的浏览器实际允许的情况更加优雅地检测和处理用户交互。

它使得编辑和维护变得更加容易。不要在整个标记中搜索JavaScript引用进行编辑，而是将所有脚本都放在一个集中位置。

来源

2011-09-15 13:33:00

以前的答案严格地从问题分离的角度来处理问题，但也有一些很好的技术原因在JavaScript中有事件处理程序。在我看来，其中最主要的是你可以使用闭包来封装事件处理程序所需的一些信息。

例如，假设您正在接收位置列表和占位符，并且想要绘制指向这些位置的链接列表，并在点击该位置时弹出一个包含该位置名称的警报弹出窗口。这是如何做到这一点的一个例子：

function alertGenerator(loc) { 
    return function() {alert("Hi, I'm visiting " + loc);}; 
} 

function createLocationList(locations, placeholder) { 
    // Create a jQuery wrapper for placeholder 
    var $placeholder = $(placeholder), 
    loc, 
    location, 
    $link; 
    // loop over the locations, create a link for each iteration 
    for (var loc in locations) if locations.hasOwnProperty(loc) { 
    location = locations[loc]; 
    $link = $("<a>"); 
    $link.text(location).click(alertGenerator(location)); 
    $placeholder.append($link); 
    }  
}

如果你要尝试使用onclick属性来做到这一点，你会遇到两个大问题。首先，你会主要处理字符串，而不是实际的函数和DOM元素（或jQuery对象）。根据我的经验，这种代码难以调试。其次，如果要参数化onclick中的函数调用，那么该参数必须是全局的，以便它在回调中位于范围内。

来源

2011-09-16 10:37:08 pdpi

欢迎除以上两个答案... thx – Dooie

我应该使用在线或有线的事件处理程序

回答

相关问题