問題描述

如題，我的頁面中有好幾個視頻，視頻的結構，名稱都一樣，想要實現的是 給他們統一綁定事件 單擊那個 那個開始播放？請問怎么整？js:

//視頻暫停播放 $('.news_main .video_box .PLAY').click(function(){var myVideo = document.getElementsByTagName(’video’)[0];if(myVideo.paused){ $(this).parents('.video_bg').hide(); myVideo.play();}else{ myVideo.pause(); $(this).parents('.video_bg').show();} });

HTML:

<p class='news_main'><!-- 視頻塊1--><p class='news_block'> <p class='video_box'><video src='http://www.cgvv.com.cn/wenda/跑道全.mp4'></video><p class='video_bg'> <img src='http://www.cgvv.com.cn/wenda/images/PLAY.png' alt=''/></p> </p> <p class='video_msg'>環氧地坪漆的優點？<span>50瀏覽</span> </p></p><!-- 視頻塊1--><p class='news_block'> <p class='video_box'><video src='http://www.cgvv.com.cn/wenda/跑道全.mp4'></video><p class='video_bg'> <img src='http://www.cgvv.com.cn/wenda/images/PLAY.png' alt=''/></p></p> <p class='video_msg'>環氧地坪漆的優點？<span>50瀏覽</span> </p></p><!-- 視頻塊1--><p class='news_block'> <p class='video_box'><video src='http://www.cgvv.com.cn/wenda/跑道全.mp4'></video><p class='video_bg'> <img src='http://www.cgvv.com.cn/wenda/images/PLAY.png' alt=''/></p> </p> <p class='video_msg'>環氧地坪漆的優點？<span>50瀏覽</span> </p></p> </p>

問題解答

要找到當前點擊塊的video標簽進行操作

var myVideo=$(this).parents('.news_block').find('.video')[0];回答2：

問題在于這一句：

var myVideo = document.getElementsByTagName(’video’)[0];

獲取video標簽，根據標簽名video返回了偽數組對象，后面的[]內是對象的索引值，你寫了[0]所以每次只能播放第一個視頻了(數組索引從0開始)。要想點擊哪個標簽就播放哪個，可以使用for循環遍歷該偽數組，配合下標確定相應的標簽播放即可

通過事件委托事件獲取當前點擊元素，$(document).on(’click’,’xx’,fn(){});