如果js中的真实条件不起作用，为什么要这样做
[英]Why does this if true condition in js doesn't work
问题描述
I'm trying to display play or pause button when a user clicks on it. 
我试图在用户单击时显示播放或暂停按钮。 I know I can actually compare those links but I think using a variable would be easier to see? 我知道我实际上可以比较那些链接，但是我认为使用变量会更容易看到？ Thanks. 谢谢。
` `
<!DOCTYPE html>
<html>
<head>
<title>ch6</title>
</head>
<body>
<h1>List</h1>
<h2>audio note</h2>
<p>Enter note name</p>
<input type="text" >
<br>
<img id="pic" onclick="click()" src="http://www.clker.com/cliparts/d/b/c/f/13652249372108434179Record%20Button%20Microphone.svg.hi.png" alt="record" style="width:50px;height:60px;">
<script type="text/javascript">
function click(){
var butt = true;
if(butt === true)
{
document.getElementById("pic").src = "https://www.shareicon.net/download/2017/02/07/878546_media_512x512.png";
butt = false;
}
else
{
document.getElementById("pic").src = "http://www.clker.com/cliparts/d/b/c/f/13652249372108434179Record%20Button%20Microphone.svg.hi.png";
butt = true;
}
}
</script>
</body>
</html>
` `
I hope to click to change the image. 我希望单击以更改图像。
The image doesn't change when I click it. 单击图像后图像不会改变。
4 个解决方案
解决方案1
3 已采纳 2017-12-05 04:20:08
Seems like HTML/JS doesn't allow a function named click to be set to onclick . 似乎HTML/JS不允许将名为click的函数设置为onclick 。 Please change 请更换
function click(){
to 至
function clickk(){
and 和
<img id="pic" onclick="click()"
to 至
<img id="pic" onclick="clickk()"
Also, move your var butt = true; 另外，将您的var butt = true; outside the function. 功能之外。
Full example below: 完整示例如下：
<!DOCTYPE html> <html> <head> <title>ch6</title> </head> <body> <h1>List</h1> <h2>audio note</h2> <p>Enter note name</p> <input type="text"> <br> <img id="pic" onclick="clickk()" src="http://www.clker.com/cliparts/d/b/c/f/13652249372108434179Record%20Button%20Microphone.svg.hi.png" alt="record" style="width:50px;height:60px;"> <script type="text/javascript"> var butt = true; function clickk() { if (butt === true) { document.getElementById("pic").src = "https://www.shareicon.net/download/2017/02/07/878546_media_512x512.png"; butt = false; } else { document.getElementById("pic").src = "http://www.clker.com/cliparts/d/b/c/f/13652249372108434179Record%20Button%20Microphone.svg.hi.png"; butt = true; } } </script> </body> </html>
解决方案2
0 2017-12-05 04:18:01
You need to take the variable initialization outside of the function itself 您需要在函数本身之外进行变量初始化
<script type="text/javascript">
var butt = true;
function click(){
if(butt === true)
{
document.getElementById("pic").src = "https://www.shareicon.net/download/2017/02/07/878546_media_512x512.png";
butt = false;
}
else
{
document.getElementById("pic").src = "http://www.clker.com/cliparts/d/b/c/f/13652249372108434179Record%20Button%20Microphone.svg.hi.png";
butt = true;
}
}
</script>
解决方案3
0 2017-12-05 04:21:54
Try use this code: 尝试使用以下代码：
<img id="pic" src="http://www.clker.com/cliparts/d/b/c/f/13652249372108434179Record%20Button%20Microphone.svg.hi.png" alt="record" style="width:50px;height:60px;">
<script type="text/javascript">
var butt = true;
var img = document.getElementById('pic');
img.addEventListener('click', click);
function click(e){
if(butt === true)
{
e.target.src = "https://www.shareicon.net/download/2017/02/07/878546_media_512x512.png";
butt = false;
}
else
{
e.target.src = "http://www.clker.com/cliparts/d/b/c/f/13652249372108434179Record%20Button%20Microphone.svg.hi.png";
butt = true;
}
}
解决方案4
0 2017-12-05 04:40:33
Declare the variable outside the click function:: 在click函数之外声明变量：：
var butt = true;
function click(){
}
now work same in that function 现在在该功能中相同
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.