jquery - 滑动时获取 jQuery UI Slider 值?

标签 jquery html css jquery-ui youtube-api

我有这个演示,您可以在其中使用 YouTube Player API 更改 YouTube 视频的时间和音量。我试图做的是在滑动或“擦洗” slider 时更新 UI slider 值。我已经实现了第一部分,它使用这段简洁的小代码片段在滑动时生动地更新了值:

slide: function(event, ui) {
    $("#content").text("video_time: " + ui.value.toString().toHHMMSS());
}

不幸的是...对于我正在尝试做的事情,当我滑动时时间更新成功,但一秒钟后重置。这是因为我有一个当前函数,它会导致它不断更新并确保 jQuery UI Slider 值与 YouTube 视频的值相匹配,使它正常工作对我来说是一个挑战。

请让我知道是否有任何可能的解决方法可以解决这个问题,谢谢!

演示: http://codepen.io/mistkaes/pen/MwONzK?editors=001

最佳答案

$("#content").text("video_time: " + player.getCurrentTime().toString().toHHMMSS());

onReady 事件中的行覆盖了 slide 事件中的行。由于你在开始搜索时暂停了视频,所以我只是检查播放器是否在onReady中暂停,如果不是,则使用播放器的当前时间作为值。

换句话说,改变

setInterval(function() {
    $("#content").text("video_time: " + 
    player.getCurrentTime().toString().toHHMMSS());
}, 250);

setInterval(function() {
    if(player.getPlayerState()!=2)//video not paused, use player time as video_time
    //thus, when the player IS paused, use the value from the slider as the 
    //video time, which is what you wanted
    {
        $("#content").text("video_time: " + 
        player.getCurrentTime().toString().toHHMMSS());
    }
}, 250);

在您的 onReady 事件中。

关于jquery - 滑动时获取 jQuery UI Slider 值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31624374/

相关文章:

jquery - 添加用户界面。垃圾图标到按钮

css - 如何在 Fullcalendar 中创建日期间隔?

html - 在不复制 HTML 的情况下使用 Bootstrap 堆叠文本组件

javascript - 我无法在 Internet Explorer 8 中清除带有 "selectedIndex = -1"的 SELECT 列表

javascript - 判断已经滚动到底部的d​​iv的id

javascript - 尝试在元素出现时执行单击功能

javascript - jQuery - 单击一个元素会触发另一个元素

javascript - 在 JQuery 中构建 div 结构并追加到另一个 Div

javascript - Android Nexus 7 (HLS) 上的空 HTML5 视频持续时间

css 在布局问题上造成了很大的差距