Question

我有一个循环播放每个视频的按钮，每个按钮对于该视频是唯一的。这是为每个视频循环的html / php。我需要点击按钮，只有视频自动播放。现在所有的视频都播放了。我知道我如何调用按钮，但不知道如何纠正它。

＆＃13;

<div id="post_<?php echo $post->ID; ?>" class="modal fade" role="dialog">
    <div class="vertical-alignment-helper">
      <div class="modal-dialog  modal-lg vertical-align-center">
        <!-- Modal content-->
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><img src="/wp-content/uploads/modal-close-x.png" /></button>
          </div>
          <div class="modal-body">
          <video id="video_<?php echo $post->ID; ?>" controls>
            <source src="<?php echo $modal_contents; ?>" type="video/mp4">
          </video>
              <br />
                <div class="row clearfix">
                  <div class="col-md-5 modal-logos"><?php MultiPostThumbnails::the_post_thumbnail(get_post_type(), 'third-image', NULL,  'post-third-image-full img-responsive'); ?></div>
                  <div class="col-md-4 modal-logos"><?php MultiPostThumbnails::the_post_thumbnail(get_post_type(), 'sub-branding', NULL,  'post-sub-branding-full img-responsive'); ?></div>
                </div>     
              </div>
        </div>
      </div>
    </div>
  </div>
<button class="btn btn-prod-spec" role="button" data-toggle="modal" data-target="#post_<?php echo $post->ID; ?>">View Demo</button>

＆＃13;

$("button.btn").click(function() {
    var videoid = $('video').closest('video').attr('id');
    alert(videoid);
    $('video').trigger("play");
});

＆＃13;

Answer 1

您的问题是即使您获得了视频ID -

var videoid = $('video').closest('video').attr('id');

您没有播放该视频，而是使用获取所有视频的选择器$('video') -

$('video').trigger("play");

我这样做的方法是在您的按钮上添加data-video，即id的{{1}} -

video

现在你的javascript可能是 -

<button class="btn btn-prod-spec" role="button" data-toggle="modal" data-video="#video_<?php echo $post->ID; ?> data-target="#post_<?php echo $post->ID; ?>">View Demo</button>

页面上有多个视频需要自动播放单击的按钮之一

1 个答案: