gpt4 book ai didi

javascript - 如何让图片按钮被点击后保持点击状态

转载 作者:行者123 更新时间:2023-12-03 08:24:36 26 4
gpt4 key购买 nike

我基本上想在单击后禁用“Rollout”和“rollover”功能。我尝试了 if 参数,但无法让它发挥作用。抱歉,我在这方面是一个真正的初学者。

我已经实现了通过单击 mother div 来更改文本,但仍然无法禁用其他功能。

<!DOCTYPE html>
<html>
<head>
<link href="styles/main.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="script.js"></script>

</head>
<script>

var Enabled = true;
function down()
{
document.getElementById("button").src = "images/click.png"; }


var Enabled = true;
function rollover()
{
if(Enabled == true)
{
document.getElementById("button").src = "images/on.png";
}else
{
document.getElementById("button").src = "images/click.png";
}
}

var Enabled = true;
function rollout()
{
if(Enabled == true)
{
document.getElementById("button").src = "images/off.png";
}else
{
document.getElementById("button").src = "images/click.png";
}
}


function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}

<script/>

<body>


<h1>My Web Page</h1>


<div class="test1">
<button type="button" onclick="myFunction()">Try it</button>
</div>


<div class="row">
<div class="col"><p id="demo">A Paragraph</p></div>
<div class="col"><img src="images/off.png" id="button"
onMouseOver="rollover ()" onMouseOut="rollout ()"
onMouseDown="down()"
onClick="myFunction()"
onClick="this.innerHTML=down()
onMouseUp="rollover ()";/></div>

<div class="col">col3</div>
</div>


</body>
</html>

最佳答案

看看这个 solution ,当单击时,它会调用 down() ,将 Enabled 设置为 false 并更改图像,现在当您翻转并推出时,它会检查 Enabled 是否为 true,如果不是,则不会更改图像。

function down(ele) 
{
ele.src = "//placekitten.com/50/30"; //Clicked
Enabled = false; }

关于javascript - 如何让图片按钮被点击后保持点击状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33609395/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com