Jquery 如果视频有道具自动播放don'；离开视口时不要暂停

我正在使用isinViewport from在查看/不查看时播放/暂停视频。但有时我不希望它们自动播放（对于没有静音且带有控件的视频）

因此，我正在使用属性autoplay检查是否在视口中

jQuery(document).ready(function ($) {
    "use strict";
    
    /* activate pause for lightbulb video if scrolled out of viewport */
    $(window).scroll(function() {
        $('video').each(function(){
            if ($(this).is(":in-viewport()") && $(this).prop('autoplay')) {
                $(this)[0].play();
            } else {
                $(this)[0].pause();
            }
        });
    });
});

现在。这很有效。但是，我设置为自动播放的视频一旦你滚动一点就会停止，这是不可取的行为。有没有一种方式可以这样说：否则，使用道具自动播放，什么都不做

也许我需要两个不同的if语句。如果使用道具自动播放什么都不做？否则就播放，否则就暂停

---

正确方向上的所有帮助都得到了赞赏

您可以在

视频

选择器中包含一个属性选择器，以排除页面从滚动更新逻辑加载时设置了

自动播放

的视频

jQuery（$=>{
“严格使用”；
让$videos=$（'video:not（[autoplay]））；
/*如果滚动出视口，则激活灯泡视频的暂停*/
$（窗口）.on（'滚动'，（）=>{
$videos.each（函数（）{
$（this.is（“：in-viewport（）”）？this.play（）：this.pause（）；
});
});
});

---

请注意，我稍微修改了逻辑，这样可以避免在

scroll

事件处理程序中创建jQuery对象，这可能会造成大量性能损失，并且在

$（这是）[0]的情况下也是多余的

可以被替换为

这个

我必须改变第一位来听文档。准备好了，但其他方面是的，这成功了！非常感谢。然而，这之后又出现了另一个小问题。一旦播放了自动播放的视频，然后手动暂停。。。滚动时，它不会暂停，而是在滚动时再次播放。可能有一个简单的解决方案吗？第一行仍然是document.ready处理程序，但我很高兴您能让它工作：）关于暂停/播放问题，我建议在与用户交互的元素上添加一个类，这样您就可以将它们从这个逻辑中过滤出来，这样它们的状态就会保持不变，而不会在滚动中更改。有点像用户与控件交互后的addclassname是吗？我要玩玩它。然后在参数中包含该类名，类似于let$videos=$（'video:not（[autoplay]））| |$（'.classname'）？谢谢，bunchWorks在safari中非常好，但在chrome中不起作用，我刚才注意到了。普。