我目前正在开发一个音乐播放器chrome扩展,而我的HTML没有响应。我发现这是因为我的onclick函数内联了javascript。
html:
<button id="pre" onclick="prev()"><img src="images/prev.png" height="90%" width="90%"/></button>
<button id="play" onclick="playOrPauseSong()"><img src="images/play.png"/></button>
<button id="next" onclick="next()"><img src="images/next.png" height="90%" width="90%"/></button>
javascript:
function playOrPauseSong(){
if(song.paused)
{
song.play();
$("#play img").attr("src","images/pause.png");
}
else
{
song.pause();
$("#play img").attr("src","images/play.png");
}
}
当然,对于prev函数和next函数,我也有相同的问题,但它们都应该有我假设的相同解决方案。
发布于 2018-09-28 09:03:14
只要你已经在使用jQuery (如果你不使用它,什么都不会改变),你可以享受jQuery提供的事件绑定方法,例如:
HTML:
<button id="play">
<img src="images/play.png"/>
</button>
JavaScript:
$("#play").on("click", function() {
if(song.paused) {
song.play();
$("#play img").attr("src","images/pause.png");
}
else {
song.pause();
$("#play img").attr("src","images/play.png");
}
}
这样,您的JavaScript代码就可以与HTML标记完全分离。
P.S.我会评论的,但我没有足够的名气。
https://stackoverflow.com/questions/52546384
复制相似问题