0

jquery に関する簡単な質問があります。YouTube から直接アップロードされた画像の長いリストがあります。画像v-codeはビデオ自体と同じです。そのため、ブラウザの 1 つのページにすべてのビデオを簡単にダウンロードするために、画像のリストを作成しました。クリックすると、ビデオがその場所に表示されます。問題は、ビデオの画像に向けたコードですが、別の画像には向けていないということです。とにかく、コードは次のとおりです。

$('.youtube_thumb > img').click(function(){
    var parts = this.src.split("/");
    var id = parts[parts.length-2];
    $('<iframe width="50%" height="300" src="http://www.youtube.com/embed/' + id + '?autoplay=1" frameborder="0" allowfullscreen></iframe>').insertAfter(this);
    $(this).parent().parent().find(".name,.detail,.youtube_play").hide();
    $(this).remove();
});

そしてdiv

<div class="youtube">
    <div class="name">
            #left(name,30)#
    </div>
    <div class="detail">#left(detail,50)#</div>
    <div class="youtube_play"></div>
    <div class="youtube_thumb">
            <img src="http://img.youtube.com/vi/#link#/0.jpg" style="width:50%;height:300px;border:0;" />
    </div>
</div>

ご覧のとおり、コードは img の src を取得して並べ替えv-code、フレーム内に配置します。しかし、私はこのコードをクラスをクリックした後でのみ動作させたいのですyoutube_playが、の画像はクリックしませんyoutube_thumb。

助けてくれてありがとう！

4

1 に答える 1

1 
$('.youtube_play').click(function(){
    var img = $(this).next().find('>img');
    var parts = img.get(0).src.split("/");
    var id = parts[parts.length-2];
    $('<iframe width="50%" height="300" src="http://www.youtube.com/embed/' + id + '?autoplay=1" frameborder="0" allowfullscreen></iframe>').insertAfter(img.get(0));
    img.parent().parent().find(".name,.detail,.youtube_play").hide();
    img.remove();
});
于 2013-10-08T11:36:44.440 に答える