jQuery로 이미지 원본 또는 이미지를 변경하지 않습니다.

Question

# play-pause는 src 속성을 변경해야합니다. 나는 innerHTML을 사용하려고했지만 나는 상쾌한 후

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" />"; 
} 

'/> "/media/pauseButton.png'싫어 입력 값의 #의 재생 - 일시 중지 변화와 비디오 기능되지 않습니다 수 .pause(); 더 이상 작동하지 않습니다.

내가 원하는 것은 이미지 소스 경로를 재생 아이콘 이미지에서 일시 중지 아이콘 이미지로 변경하는 것입니다. 다음은 문서 준비에 대한 레이아웃 html의 초기 출력입니다 :

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

Answer 1

jQuery를 사용하고 있으므로와 같은 jQuery 선택기를 사용하여 요소를 가져올 수 있습니다.또한 나는 항상 두 이미지를 가지고 있고 어떤 이미지가 $('#play-pause').show() 및 $('#play-run').hide()을 사용하여 표시되는지 조작 할 것을 제안합니다.