将 javascript 事件绑定到 MVC 控件答案

【问题标题】：Bind javascript events to MVC controls将 javascript 事件绑定到 MVC 控件
【发布时间】：2012-05-21 20:45:33
【问题描述】：

将 Javascript 事件绑定到我的自定义 MVC 控件的最佳方法是什么？我最初的想法是使用 Html Helpers 创建控件，它为它们提供一个 CSS 类，表示它们是什么类型的控件。然后，在document.ready 上，我将使用 jQuery 按类名选择所有此类控件并绑定它们的事件。

但是，我担心按类名从整个 dom 中进行选择的速度。我已经阅读（并且经历过）这可能有多慢，尤其是在我们需要针对该项目的 IE8 中。

我可以通过为每个页面创建一个 js 文件来按 ID 进行选择，但我不想这样做，因为它是一个包含大量页面的复杂 Web 应用程序。如果视图包含至少一种类型的控件，我宁愿为视图中包含的每种类型的控件创建一个 js 文件。

CSS 类是我的最佳选择吗？还有其他想法吗？我正在使用 MVC3。

【问题讨论】：

标签： javascript jquery asp.net-mvc asp.net-mvc-3 jquery-events

【解决方案1】：

我的建议是通过课程进行尝试并测试性能。如果您不满意，请切换到 ID。我一直使用类选择器，并且在任何浏览器中都没有发现它们非常慢。当你给 jquery 一个上下文来搜索时，事情会很快。例如：

$('#controls .control').whatever();

或者

$('.control', '#controls').whatever();

Sizzle 擅长优化这些东西以提高速度。

编辑： 以下是关于 jQuery 性能提示的一般参考（注意 #5）： http://net.tutsplus.com/tutorials/javascript-ajax/10-ways-to-instantly-increase-your-jquery-performance/

【讨论】：

谢谢，但我无法根据上下文进行选择，因为控件可能位于页面上的任何位置。为了清楚起见，我将无法选择“每页”，它必须是一种适用于整个网络应用程序的通用方法。查看我的编辑。
@JoshNoe 我不明白为什么如果不为每个页面创建一个 js 文件就不能按 ID 选择。仅仅是因为您不想包含不在页面上的控件的代码吗？如果是这样，那么当您说如果视图包含至少一种此类控件时，您宁愿为包含在视图中的每个控件都有一个 js 文件，那么听起来您走在正确的轨道上。你不能这样做并按 ID 选择吗？
我的 js 文件如何知道要选择哪些 ID？例如，假设我在两个页面上有一个控件类型“CustomDropDown”。其中一个页面有一个 ID 为“companies”的 CustomDropDown，另一个页面有一个 ID 为“racecars”的页面。这两个页面都将使用相同的“CustomDropDown.js”文件，它不知道这些 id。
@JoshNoe 如果预期它们的功能不同，您只需要给它们不同的 ID。否则，如果你的 js 打算对它们一视同仁，你可以给它们一个“CustomDropDown”的 id。
@Ibstr 谢谢，但在这种情况下这并不实际，原因有几个。一方面，我可能会在页面上有多个相同类型的控件（我想我可以将第二个命名为“CustomDropDown2”并迭代直到找不到，但这有异味）。更重要的是，我可能需要在这些控件上使用特定于页面的客户端功能，因此我希望通过页面 js 中的 id 来访问它们，因此我需要更多描述性的 id。