1

私は 2 つの機能を持っています。両方をアクティブにするには同じ場所をクリックする必要があるため、それらをまとめようとしましたが、機能しません。

何らかの理由で、ビデオを含む div を配置すると (関数がなくても)、2 番目の関数が機能しなくなります。機能させるにはどうすればよいですか？

ビデオプレーヤーの機能は次のとおりです。

$(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()と も使用していることに注意してください(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

このように2つを組み合わせてみませんか？クリック イベント ハンドラーの 1 つが他のクリック ハンドラーをオーバーライドし、それが登録されていない可能性があると思われます。

$(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 に答える