1

我有两个功能，一个在点击时播放视频（并更改播放的视频），然后是一个应该使 DIV 的不透明度为零的功能。我试图将它们放在一起，因为您应该单击同一个位置来激活它们，但它不起作用。

出于某种原因，当我放置包含视频的 div（即使没有它的功能）时，第二个功能停止工作。我该怎么做才能使工作？

视频播放器的功能是：

$(window).load(function(){
    $('li', '.thumbs').on('click', function() {
        var numb = $(this).index(),
            videos = ['images/talking1.m4v', 'images/talking2.m4v', 'images/talking1.m4v', 'images/talking2.m4v', 'images/talking1.m4v', 'images/talking2.m4v'],
            myVideo = document.getElementById('myVid');

        myVideo.src = videos[numb]; 
        myVideo.load();
        myVideo.play();

    });
});

对于图像：

$(window).load(function(){
    $(function() {
        $('li', '.thumbs').click(function() {
            $('#MyT').addClass('clear');
        });
    });
});

我知道两者都不应该有$(window).load(function()，那只是因为它们是分开的。

4

3 回答 3

1

你确定你的多重选择器语法是你想要的吗？如果你想将逗号分隔的选择器应用于所有这些元素，则必须只引用一次，否则你只是传递一个context. 无论如何，我通常会发现上下文是不必要的，除非它是以前缓存的选择器。更多信息在jQuery API。

$('li, .thumbs') // All `li` and all `.thumbs`
$('.thumbs li') // All 'li` within `.thumbs`

请注意，您也在使用(window).load()and (document).ready()。当你结合两者时，选择一个或另一个。有一个细微但重要的区别。然后你可以像这样组合所有东西，它应该可以工作。

$(document).ready(function () {

    $('li, .thumbs').on('click', function () {

        // Add class
        $('#MyT').addClass('clear');

        // Video stuff
        var numb = $(this).index(),
            videos = [
                'images/talking1.m4v',
                'images/talking2.m4v', 
                'images/talking1.m4v', 
                'images/talking2.m4v', 
                'images/talking1.m4v', 
                'images/talking2.m4v'
            ],
            myVideo = document.getElementById('myVid');
            myVideo.src = videos[numb];

        myVideo.load();
        myVideo.play();

    });

});
于 2012-05-06T21:21:03.647 回答
0

为什么不像这样将两者结合在一起呢？我怀疑您的一个单击事件处理程序可能会覆盖另一个单击处理程序并导致它不注册。

$(window).load(function(){
    $('li', '.thumbs').on('click', function() {
        var numb = $(this).index(),
            videos = ['images/talking1.m4v', 'images/talking2.m4v', 'images/talking1.m4v', 'images/talking2.m4v', 'images/talking1.m4v', 'images/talking2.m4v'],
            myVideo = document.getElementById('myVid');
        myVideo.src = videos[numb]; 

        myVideo.load();
        myVideo.play();

        $('#MyT').addClass('clear');
    });
});
于 2012-05-06T21:15:32.020 回答
0

如果他不起作用，请将函数分开并使用window.onload(*function*).

像这样：

function vP() {
   $('li', '.thumbs').on('click', function() {
      var numb = $(this).index(),
      videos = ['images/talking1.m4v', 'images/talking2.m4v', 'images/talking1.m4v', 'images/talking2.m4v', 'images/talking1.m4v', 'images/talking2.m4v'],
      myVideo = document.getElementById('myVid');
      myVideo.src = videos[numb]; 
      myVideo.load();
      myVideo.play();
   });
}
function iM() {
   $('li', '.thumbs').click(function() {
      $('#MyT').addClass('clear');
   });
}
window.onload(iM();vP();)
于 2012-05-06T21:28:12.130 回答