Question

您已创建了一个视频播放列表，其中包含每个视频的暂停和开始按钮。除了更改按钮的图像外，一切都有效。

如何获取当前视频索引并传递给playPauseImg [0] ???

以下是我的一些代码：

<span>
    <input type="image"  class="playPauseImg" id="playPauseImg" img src="../../Icons/Play Button Green 24 x 24.png" onClick="playPauseSelect();">
    <a href="../../Bridesmaid's Entrance Ceremony Music/Angel - Jack Johnson.mp3">
        <p class="playlist_btn_text">AAngel - Jack johnson</p>
    </a>
<span/>

var video_playlist = document.getElementById("video_player");
var links = video_playlist.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
    links[i].onclick = handler;
};


function handler(e) {
    e.preventDefault();
    videotarget = this.getAttribute("href");
    filename = videotarget.substr(0, videotarget.lastIndexOf('.')) || videotarget;
    video = document.querySelector("#video_player video");
    source = document.querySelectorAll("#video_player video source");
    source[0].src = filename + ".mp3";
    video.load();
    video.play();
    playPauseImg[0].src = "../../Icons/Audio Stop Button 24 x 24.png";
}

function playPauseSelect() {
    if (video.paused) {
        video.play();
        playPauseImg[0].src = "../../Icons/Audio Stop Button 24 x 24.png";
    } else {
        video.pause();
        playPauseImg[0].src = "../../Icons/Play Button Green 24 x 24.png";
    }
};

Answer 1

我还没有评论，这就是我回答的原因。我想知道你何时使用id #video_player也不清楚你在哪里使用jquery，请告诉我们为什么你添加了jquery标签。另外，你没有提到你的代码或什么告诉我们所谓的视频索引可能是什么。

通过猜测你的问题的答案可能是什么，我会说： - 找到视频索引 - 搜索视频索引和playPauseImg之间的关系。 - 迭代它并放入一些条件并保存值。

Answer 2

你需要的是clausure。

links[i].onclick = handler;

应改为

links[i].onclick = function(index){
  return function(evnt){
      handler.call(window,evnt,index);
  }
}(i);

现在处理程序中的第二个参数将获取索引并更改处理程序以支持索引。

如何获取所选播放列表项的索引

2 个答案: