第二个button“清空”onclick事件if (x = false) 时无法触发document.getElementById('info').innerHTML = '再见,下次再玩!'
if (x = true) 时能够触发document.getElementById('myname').innerHTML = '你的姓名是:'; 以及document.getElementById('mymajor').innerHTML = '你的专业是:';
但也无法触发document.getElementById('info').innerHTML=‘’
代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
button {
margin: 10px;
width: 100px;
height: 40px;
border: 1px solid darkblue;
background-color: #00008B;
color: white;
font-size: 20px;
border-radius: 5px;
}
button:hover {
background-color: darkslategray;
}
span {
display: block;
}
</style>
</head>
<body>
<h3>使用消息框来和用户互动</h3>
<span id="myname">你的姓名是:</span>
<span id="mymajor">你的专业是:</span>
<button type="button" onclick="message()">点我</button>
<button type="button" onclick="buyongclear()">清空</button>
<span id="info" style="display: none;"></span>
<script type="text/javascript">
function message() {
document.getElementById('info').style.display = 'none';
var m = confirm('想回答问题吗?');
if (m == true) {
var x = prompt('第一个问题:你的姓名是什么?');
if (x != '' || x != null) {
document.getElementById('myname').innerHTML = '你的姓名是:' + '<strong>' + x + '</strong>';
}
var y = prompt('第二个问题:你的专业是什么?');
if (y != '' || y != null) {
document.getElementById('mymajor').innerHTML = '你的专业是:' + y;
}
if (x == null && y == null || x == '' && y == '') {
document.getElementById('info').style.display = 'block';
document.getElementById('info').innerHTML = '你都没有输入呢!';
}
} else {
document.getElementById('info').style.display = 'block';
document.getElementById('info').innerHTML = '好吧,不想回答问题,那byebye!';
}
}
function buyongclear() {
var x = confirm('要再来一次吗?');
if (x = true) {
document.getElementById('myname').innerHTML = '你的姓名是:';
document.getElementById('mymajor').innerHTML = '你的专业是:';
document.getElementById('info').innerHTML = '';
}
if (x = false) {
document.getElementById('info').innerHTML = '再见,下次再玩!';
}
}
</script>
</body>
</html>