div onclick会提示是或否，如果是，则div更改为其他颜色 [英] div onclick prompts yes or no, if yes, div change to different color
本文介绍了div onclick会提示是或否，如果是，则div更改为其他颜色的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在一个接收用户数据的网站上工作，不管他是否确实会帮助患者.
i am working on a website that receives the user data whether if he is indeed going to help a patient.
我真的不知道该如何启动，我已经使用了1个简单的功能了几周了.
i really dont know how to start this and im been on 1 simple function for weeks.
示例:我单击正方形，它提示我是或否，颜色变为黄色. 单击黄色的正方形，将提示我另一个是"或否".将其恢复为原始颜色.
Example: i clicked square, it prompts me yes or no, the color turns yellow. clicking on the square, which is yellow, will prompt me another yes or no. turning it back to the original color.
function myFunction() {
if (confirm("Press a button!") == true) {
document.getElementByClass("stileone").style.backgroundColor = "lightblue";
}
else {
txt = "You pressed Cancel!";
}
if (confirm('Are you sure you want to save this thing into the database?') == true) {
// Save it!
} else {
// Do nothing!
}
.foo {
float: left;
width: 30px;
height: 30px;
margin: 5px;
border: 1px solid rgba(0, 0, 0, .2);
border-radius: 25%;
}
.blue {
background: #13b4ff;
}
.whole {
float: left;
width: 900px;
height: 900px;
margin: 5px;
border: 1px solid rgba(0, 0, 0, .2);
}
.purple {
background: #ab3fdd;
}
.wine {
background: #ae163e;
}
<!doctype html>
<head>
</head>
<body>
<div class = "whole">
<div id = "centerbox1" class="foo blue">A1</div>
<div id = "centerbox2"class="foo purple">A2</div>
<div id = "centerbox3"class="foo wine">A3</div>
<br>
<br>
<div id = "centerbox4"class="foo blue">B1</div>
<div id = "centerbox5"class="foo purple">B2</div>
<div id = "centerbox6"class="foo wine">B3</div>
</div>
</body>
</html>
推荐答案
这里是您问题的纯Javascript解决方案.
Here is a pure Javascript solution for your problem.
function myFunction() {
if (confirm("Press a button!") == true) {
if(this.style.backgroundColor == "yellow")
this.style.backgroundColor = "";
else
this.style.backgroundColor = "yellow";
} else {
txt = "You pressed Cancel!";
}
if (confirm('Are you sure you want to save this thing into the database?') == true) {
// Save it!
} else {
// Do nothing!
}
}
var blocks = document.getElementsByClassName("foo");
for (i = 0; i < blocks.length; i++) {
blocks[i].addEventListener("click", myFunction);
}
.foo {
float: left;
width: 30px;
height: 30px;
margin: 5px;
border: 1px solid rgba(0, 0, 0, .2);
border-radius: 25%;
}
.blue {
background: #13b4ff;
}
.whole {
float: left;
width: 900px;
height: 900px;
margin: 5px;
border: 1px solid rgba(0, 0, 0, .2);
}
.purple {
background: #ab3fdd;
}
.wine {
background: #ae163e;
}
<div class="whole">
<div id="centerbox1" class="foo blue">A1</div>
<div id="centerbox2" class="foo purple">A2</div>
<div id="centerbox3" class="foo wine">A3</div><br><br>
<div id="centerbox4" class="foo blue">B1</div>
<div id="centerbox5" class="foo purple">B2</div>
<div id="centerbox6" class="foo wine">B3</div>
</div>
这篇关于div onclick会提示是或否，如果是，则div更改为其他颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
