如何将javascript从运行推迟到浏览器内部'；你的观点是什么？

我希望运行一个计数脚本，一旦它在浏览器视图中运行，就像它在chicagolawyer.com的视频播放器模块上运行一样。据我所知，他们使用jquery.appeage.js（）实现了这一点，我找到了一个计数脚本（），我可以在我正在设计的网站上使用它，但无法确定如何实现浏览器视图延迟脚本。以下是我在Joomla模块上输入的代码：

<h1 id="casesWon"></h1>
<script type="text/javascript">
var options = {
    useEasing : true,
    useGrouping : true,
    separator : ',',
    decimal : '.',
    prefix : '',
    suffix : '% Cases Won'
};
var count1 = new CountUp("casesWon", 0, 98, 0, 10, options);
$('casesWon').on('appear', count1.start());
</script>

变量选项={
对,，
对,，
分隔符：'，'，
十进位：'.'，
前缀：“”，
后缀：'%Cases将不会
};
var count1=新的倒计时（“案例”，0,98,0,10，选项）；
$（'casesWon'）.on（'execute'，count1.start（））；

---

如果我将最后一行切换为just count1.start（），则此代码将毫不延迟地工作；所以我只是想弄清楚jquery.appeage.js有什么问题。谈到Javascript，我是一个新手，所以我确信我缺少的是一些简单的东西。为jquery脚本提供的文档看起来很模糊，但对于比我更了解jquery的人来说可能已经足够了。请帮助。

确保您正在使用

$('#casesWon').on('appear', count1.start());

而不是

$('casesWon').on('appear', count1.start());

也许只是这里的一个输入错误，也许是代码上的一个输入错误！；）

编辑： 此外，您可能需要这样使用它：

$('#casesWon').on('appear', count1.start);

---

为了防止在加载时执行

经过大量的阅读和实验，我终于找到了让这两个脚本协同工作的方法。创建了第三个脚本，而不是直接将代码输入模块。脚本如下：

jQuery(function($) {
    var $casesWon = $('#casesWon');

    var optionsCases = {
        useEasing : true,
        useGrouping : true,
        separator : ',',
        decimal : '.',
        prefix : '',
        suffix : '% Cases Won'
    };

    var countCases = new CountUp("casesWon", 0, 98, 0, 10, optionsCases);

    $('#casesWon').appear();

    $(document.body).on('appear', function(e, $affected) {
        // this code is executed for each appeared element

        console.log( $affected );
        $affected.each(function() {         
            countCases.start();
        });
    });

});

---

执行此操作时，计数脚本将等待id为“casesWon”的元素出现在浏览器视图中，然后开始计数。感谢@monxas和@KevinB的帮助。投票否决这个问题的人可能会搞砸，因为我在stackoverflow上寻找答案，然后才对其他网站如何做到这一点进行研究。希望这能帮助其他人。

首先，在这种情况下，您应该传递一个匿名函数来完成这项工作，否则您将丢失对实例的引用。另外，

$（'casesWon'）.on（'execute'，count1.start（））

基本上等同于

count1.start（）

，除非

count1.start（）

返回函数事件处理程序。感谢您的观察，这方面完全是新手，因此我将必须找出如何传递匿名函数，但我确信我能得到它。就count1.start（）的功能而言，它开始向上计数。我将end修改为

$（'#casesWon'）。on（'execute'，function（）{count1.start（）；}）但这并没有导致任何差异。我不确定这是否是你所说的匿名函数，我也是一个完全的新手。如果你所说的
demo.start（）
是指你的问题中的
count1.start（）
，那么是的，这就是我所暗示的。有用吗？是的，我就是这个意思。编辑了我以前的评论。不幸的是没有区别。我认为我弄错的地方是误解了jquery.appeage.js的工作原理。对于脚本示例，我不知道这有助于理解，但值得一看。我明白你的意思。很可能事件甚至没有被触发。谢谢你的观察。我尝试过使用和不使用#，使用和不使用（），遗憾的是，这并没有改变结果。关于这个答案的一个注意事项是：最后一个代码片段非常接近，但它遇到了一个问题，即传递存储在
start
中的函数，它将在触发事件的元素的上下文中执行，而不是在
count1
实例中执行，这可能（在本例中）导致进一步的问题。