一个好的做法是在一个文件中包含所有页面所需的代码,并为需要特定功能的页面提供特定的 javascript 文件。听起来这就是你正在做的事情,所以我们有一个很好的基础。
您可以通过多种方式构建哪些页面需要哪些文件,但请记住,在正常情况下,javascript 文件会被浏览器缓存,因此这些文件只需要下载一次。
鉴于此评论
是的,但是如果您有多个
具有相同 DOM 元素的页面?为了
例如,我的 validator() 插件已设置
像 $('form').validate() 一样,但是
有时我不想让它起作用
页面上的所有表格,只有一些
其中。在这种情况下我该怎么办?
我建议提出一个约定,通过该约定来标记需要“附加”某些 jQuery 插件的页面中常见的元素。例如,如果您在需要validator() 插件的多个不同页面上有一个<form> 元素,但在任何一个特定页面上都有多个<form> 元素(并且并非所有<form> 元素都应该有validator() 插件),那么我建议使用 CSS 类来区分确实需要插件的 <form> 元素。
<!-- HTML -->
<!-- need to apply plugin to this -->
<form class="validator"> ... </form>
<!-- but not to this -->
<form> ... </form>
<script type="text/javascript">
// jQuery Code (in a separate file)
$(function() {
$('form.validator').validator();
});
</script>
这样,插件将仅应用于与选择器匹配的<form> 元素。
编辑:
我不确定 rails 中的帮助程序是如何工作的,但是对于不直接属于 @987654332 的任何数据,您可以使用 bind() 方法的 data 参数将数据传递给 jQuery 中的事件处理程序@ 元素本身(如href 之类的属性)。如果某些链接需要 AJAX,那么使用 CSS 类标记这些链接并将 URL 存储在元素的 href 中可能是有意义的。然后在您的 jQuery 代码中,可以在任何具有通过 AJAX 发出请求的链接的页面上使用,您可以执行类似的操作
<a class="ajax-link" href="/get/someData.php">Data retrieved through AJAX</a>
<a href="/normalLink.php">Standard link with no AJAX</a>
<script type="text/javascript">
$('a.ajax-link').bind('click',ajaxRequest);
function ajaxRequest(e) {
e.preventDefault();
$.get(e.target.href, function(data) {
$('#loadDiv').html(data);
});
}
</script>
当用户禁用 JavaScript 时,该链接将按照正常链接工作,但在启用 JavaScript 时将发出 AJAX 数据请求。我在这里使用了一个命名函数,ajaxRequest,因为它可以更容易地调试脚本(也许还可以重用),但如果你愿意,你可以使用匿名函数。