0

如果您曾经使用过 OpenCart，并且您是正确标记和优化的忠实拥护者，那么您已经知道*它是多么痛苦。

整个模板都有内联js，因为它依赖于模板中的php变量来执行js。

我目前正在开发 OC 的 HTML5 分支，它将所有这些废话从模板中移出，并将所有链接的 js 文件移动到它们应该在的页面底部。

问题是有一个客户现在想要这个，并且正确移动所有这些脚本需要数周时间，所以我试图找到一种可靠的方法来推迟内联脚本，以便它只会在所有文件都执行后执行加载在底部。

我尝试在 script 标签上使用 defer，但 Chrome 仍然会在找到它后立即执行它，我想大多数其他浏览器也会这样做。

例如这里的轮播模块：

<div id="carousel<?php echo $module; ?>" class="es-carousel-wrapper">
   <div class="es-carousel">
      <ul>
      <?php foreach ($banners as $banner) { ?>
         <li>
             <a href="<?php echo $banner['link']; ?>">
                 <img src="<?php echo $banner['image']; ?>" 
                    alt="<?php echo $banner['title']; ?>" 
                    title="<?php echo $banner['title']; ?>" />
             </a>
         </li>
      <?php } ?>
      </ul>
   </div>
</div>
<script type="text/javascript" defer>
    $('#carousel<?php echo $module; ?>').elastislide({
        speed       : 450,
        easing      : '',
        imageW      : 290,
        <?php if ($limit > 3): ?>
        minItems    : <?php echo $scroll; ?>
        <?php else: ?>
        minItems    : 1
        <?php endif ?>
     });
     $(window).triggerHandler('resize.elastislide');
</script>

如您所见，将其保留在模板页面中并仅使用 php 中的变量要容易得多，显然正确的方法是将变量实现到 js 中并稍后调用它们，这就是我为另一个客户端所做的，但这需要很长时间。

有没有一种可靠的方法可以使用 defer 来实现这一点？

谢谢。

-文斯

4

0 回答 0