3

我正在尝试使用交换来根据屏幕尺寸更改图像。

但是，当初始化交换时，不会加载任何图像。然后，当我调整浏览器的大小（1024 像素及更低）时，控制台中出现错误消息：

Uncaught TypeError: Cannot read property 'nodeName' of undefined

这与foundation.interchange.js的第47行有关，即：

if (/IMG/.test(el[0].nodeName)) {

我尝试使用的代码是：

<img data-interchange="[http://www.example.com/image.png, (default)], [http://www.exmaple.com/image-large.png, (large)]" />

根据 Zurb 的文档，这是完全标准的。我已经确保图像存在，它们确实存在。

我正在使用 Foundation 版本 5.2.2。

有任何想法吗？

4

1 回答 1

1

我遇到了这个问题并通过一些简单的测试解决了它......

尝试其中一些：

  1. 检查 - 您只调用脚本路径“interchange.js”的一个实例

为什么？- 这将确保您避免插件内重复的函数调用。

如何？- Ctrl-f（查找）查看源页面上的单词“interchange.js”

这是检查它的最佳方式，尤其是在您使用 MVC 或嵌套 webforms 框架时。

  1. 检查 - $(document).foundation(); 在 exchange.js 脚本加载后调用

例如。按此顺序....

<script src="/foundation/foundation.js")></script>
<script src="/foundation/foundation.interchange.js"></script>

<script type="text/javascript">
    $(document).ready(function () {

        $(document).foundation();

     });
</script>

为什么？- 我相信，一旦基础启动，交换就必须存在。

我希望这些选项有所帮助 - 抱歉，如果它有点基本 - 但同样值得一试干杯

于 2014-09-19T10:12:10.457 回答