0

我有一个使用一些 JavaScript/jQuery 插件的网站，然后我有一个default.js文件，它为每个不同的页面使用插件功能。

例如，我拥有的一些插件包括：

  • 自定义滚动条插件
  • 幻灯片插件
  • 一个cookie插件
  • 等等

然后在default.js文件中，我将执行如下操作（伪代码）：

var scrolling = findScrollbarDiv;
scrolling.ScrollFunction({ options });

（然后对于幻灯片+我拥有的其他插件也是如此）

但是，如果有一个findScrollbarDiv返回 null 的地方，我会收到类似以下的错误：

ScrollFunction 不是函数

这不是因为元素返回 null，而是因为我没有包含此页面的插件文件。我的理由是我不想在每个页面上都包含每个文件（即使它不需要），因为这可能会导致不必要的 HTTP 请求（尤其是在主页上，它只需要一个插件）

这个错误反过来又搞乱了 JavaScript 的其余部分。

克服这个问题的最佳方法是什么？无论是否需要，我都应该在每个页面上包含每个插件文件吗？或者是否有一些类似以下的 JavaScript 可以使用：

var scrolling = findScrollbarDiv;
if(scrolling != null) {
    scrolling.ScrollFunction({ options });
}

（这对我来说有点笨拙，但如果这是最好的解决方案，请告诉我）

还是使用一个默认的 js 文件来启动所有插件是个坏主意？

4

2 回答 2

1

如果您使用相同的头文件并且不介意包含该文件，则可以始终在将事件附加到该元素之前检查该元素是否存在。

这是一个例子：

if(jQuery('#someElement').length > 0){
    jQuery('#someElement').ScrollFunction({ options });
}

要么，要么为每个函数提供一个 JavaScript 文件。

因此，您将有一个用于画廊，一个用于 cookie 等。并且仅包括每个页面所需的那些。

于 2012-12-18T11:09:15.440 回答
1

如果：

scrolling && scrolling.ScrollFunction({ options });

这对于您想要调用的任何方法都非常有用，并且想要在您执行之前检查父对象是否存在。您可以更进一步（如果需要）并在执行之前检查方法本身是否存在：

scrolling && scrolling.ScrollFunction && scrolling.ScrollFunction({ options });

如果滚动是一个集合，只需检查它的长度（如果长度 == 0，语句将失败）：

scrolling.length && scrolling.ScrollFunction({ options });
于 2012-12-18T11:17:34.123 回答