0

#play-pause 应该改变 src 属性。我尝试使用 innerHtml 但我无法输入像'/media/pauseButton.png" />'这样的值

var video = document.getElementById("postvideo");
var playButton = document.getElementById("play-pause");
// Event listener for the play/pause button
playButton.addEventListener("click", function() {
if (video.paused == true) {
    // Play the video
    video.play();
    // Update the button to 'Pause'
    playButton.innerHTML = "<img src="<?php echo get_template_directory_uri(); ?>/media/playButton.png" />";
} else {
    // Pause the video
    video.pause();

    // Update the button to 'Play'
    playButton.innerHTML = "<img src="<?php echo get_template_directory_uri(); ?>/media/pauseButton.png" />";
}

刷新后，#play-pause 没有改变，函数 video.pause(); 不再工作。

我想要它做的是更改图像源路径以从播放图标图像更改为暂停图标图像。这是文档就绪时布局 html 的初始输出：

<div id="play-pause">
    <img src="<?php echo get_template_directory_uri(); ?>/media/playButton.png" />
</div>
4

1 回答 1

1

由于您使用的是 jQuery，因此您可以使用 jQuery 选择器获取元素，例如$('#postvideo');我还建议您始终将这两个图像都放在那里，并使用例如$('#play-pause').show()和$('#play-run').hide().

于 2013-05-11T05:28:22.993 回答