您的位置：首页 > Web前端 > JavaScript

JavaScript小功能

2017-06-16 19:16 120 查看

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">

booleanValue = true;
function sub(){
var userName = document.getElementById("name").value;
var age = document.getElementById("age").value;
var sex = document.getElementById("sex").value;

document.getElementById("nameShow").innerHTML = userName;
document.getElementById("ageShow").innerHTML = age;
document.getElementById("sexShow").innerHTML = sex;

if (this.booleanValue){
document.getElementById("myDiv").style.display = "block";
}else {
document.getElementById("myDiv").style.display = "none";
}
this.booleanValue = !this.booleanValue;
}
</script>
</head>
<body>
<form method="post" action="js_Home.iml">
<label for="name">姓名:</label>
<input id="name" type="text">
<br/>
<label for="age">年龄:</label>
<input id="age" type="text">
<br/>
<label for="sex">性别:</label>
<input id="sex" type="text">
<input type="button"value="注册" style="background: blue" onmouseup ="this.style.background='red'"
onmouseover="this.style.background = 'blue'" onmouseout="this.style.background = 'cyan'" onclick="sub();">
<br/>
<div id="myDiv" style="display: none; width: 100%; height: 200px;background-color: blue;">
<p>注册的姓名:<span id="nameShow"></span></p>
<p>注册的年龄:<span id="ageShow"></span> </p>
<p>注册的性别:<span id="sexShow"></span> </p>
</div>
<input type="submit" value="做作业">
</form>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航