javascript - 如果或在加载元素之后调用函数

标签 javascript jquery html call

我的问题是如何在加载元素或页面上的元素后触发或调用函数,并且不想等待整个页面加载。

fiddle 示例: http://jsfiddle.net/8bJUc/275/
fiddle 问题: http://jsfiddle.net/8bJUc/274/

调用JS:

document.getElementsByClassName("owlCarousel").onLoad = function(){

// do stuff

$("#owl-demo").owlCarousel({
navigation: true,
pagination: true,
lazyLoad: true
});

};

HTML:

<span class='slide'>
<div id="owl-demo" class="owl-carousel">  <!-- If .owl-carousel has been loaded -->
  <div>
  <!-- Contents -->
 </div>
</div>
</span>

所以我的意思是,如果 .slide.owl-carousel 类,那么调用函数就可以工作。
期待建议?

最佳答案

当正文加载时,div 几乎会立即加载。它没有 onload 事件,并且在完成加载后执行脚本的唯一方法是将脚本添加到 DOM 中的紧随其后的位置(正如其他一些答案所建议的那样)。

Fiddle实现此选项。

注意,您需要将脚本包装在页面的标题中才能使事情正常工作(查看我设置的 jsfiddle 选项)

在你的 HTML 中它看起来像

<head>
    ... rest of your stuff ...
    function launchScript() {
        // do stuff
        $("#owl-demo").owlCarousel({
            navigation: true,
            pagination: true,
            lazyLoad: true
        });    
    }
</head>

然后:

<div id="owl-demo" class="owl-carousel"> <!-- If .owl-carousel has loaded-->
...
</div>
<script>
    launchScript();
</script>

关于javascript - 如果或在加载元素之后调用函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30004082/

相关文章:

jquery - 为什么在执行 ajax 请求时有时必须解析 JSON,有时则不需要?

jquery - CSS - 如何使溢出隐藏在右边而不是左边?

html - 单击链接时防止页面转到顶部

javascript - 使用响应表在表顶部进行列搜索

javascript - Access-Control-Allow-Headers 不允许 X-Requested-With

javascript - iPhone/iOS - [NSBundle mainBundle] pathForResources 无法查看 Javascript 文件

javascript - 未调用 AJAX 成功回调函数

javascript - 将 `this` 与对象文字一起使用

javascript - 动态 html 和 javascript 函数

javascript - 使用 prevState 实现计数器功能