这里写自定义目录标题
我的页面：
代码实现：
我的页面
#jsddm li
{ float: left;
list-style: none;
font: 12px Tahoma, Arial}
#jsddm li a
{ display: block;
background: #324143;
padding: 5px 12px;
text-decoration: none;
border-right: 1px solid white;
width: 70px;
color: #EAFFED;
white-space: nowrap}
#jsddm li a:hover
{ background: #24313C}
#jsddm li ul
{ margin: 0;
padding: 0;
position: absolute;
visibility: hidden;
border-top: 1px solid white}
#jsddm li ul li
{ float: none;
display: inline}
#jsddm li ul li a
{ width: auto;
background: #A9C251;
color: #24313C}
#jsddm li ul li a:hover
{ background: #8EA344}
? 版权信息
代码页面：  | 请注册账户 | |
| 密码：(数字和字母,长度8-12) | 请输入注册用户密码 | |
| 确认密码 | 确认密码要一致 | |
| 出生日期 | 年月日 | 请输入4位年，2位月，日的范围为1至31 |
| 性别 | 男女 | 请选择性别 |
| 电子邮件 | 请输入正确的Email格式 |
<script>
function check1()//账户格式检查
{
var reg=/^(1\d{10})|([1-9][0-9]{4,11})|(\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*)$/;
var user=document.getElementById("pt1").value;
var t=reg.test(user);
if(t==true)
{alert("格式正确");
}
}
function check2()
//确认密码检查
{
var pa=document.getElementById("pt2").value;
var pa1=document.getElementById("pt3").value;
if(pa==pa1)
{
alert("两次密码一致");
}
}
function check3()//密码格式的检查
{
var pa=document.getElementById("pt2").value;
var reg=/^[0-9a-zA-Z]{8,12}$/;
var t=reg.test(pa);
if(t==true)
{alert("格式正确");}
}
function Cyear(){
var year=document.getElementById("year");
var da=document.getElementById("dat");
if(year.value.length!=4){
da.innerHTML="<p style='color: red;'>错误，年不为4位</p>";
year.focus();
}
else{
da.innerHTML="<p style='color: green;'>日期格式正确</p>";
}
}
function Cmonth(){
var month=document.getElementById("month");
var dat=document.getElementById("dat");
if(month.value.length!=2){
dat.innerHTML="<p style='color: red;'>错误，月不为2位</p>";
month.focus();
}
else{
dat.innerHTML="<p style='color: green;'>日期格式正确</p>";
}
}
function Cdate(){
var date=document.getElementById("date");
var dat=document.getElementById("dat");
if(0<date.value<=31&&isNaN(date.value)==false){
dat.innerHTML="<p style='color: green;'>正确</p>";
}
else{
dat.innerHTML="<p style='color: red;'>日位错误</p>";
date.focus();
}
}
function check5(){
var email=document.getElementById("email");
var emai=document.getElementById("emai");
var reg=/^[0-9a-zA-Z_\.-]+[@][0-9a-zA-Z_\.-]+([\.][a-zA-Z]+){1,2}$/;
if(reg.test(email.value)){
emai.innerHTML="<p style='color: green;'>email格式正确</p>";
}
else{
emai.innerHTML="<p style='color: red;'>错误，email格式不正确</p>";
email.focus();
}
}
</script>
</body>
计算器页面代码：
计算器页面
<input type="button" value="4">
<input type="button" value="5">
<input type="button" value="6">
<input type="button" value="-"></br>
<input type="button" value="1">
<input type="button" value="2">
<input type="button" value="3">
<input type="button" value="+"></br>
<input type="button" value="%" id="m">
<input type="button" value="0">
<input type="button" value=".">
<input type="button" value="="></br>
</div>
</div>
<style>
*/*取消浏览器自动为我们添加的8px的内外边距*/
*{
margin: 0 ;
padding: 0;
}
/*设置body的高度大于浏览器的高度,以便观察对计算器设置固定定位的效果*/
body{
height: 2px;
}
/*给所有div元素设置固定宽度*/
div{
width: 320px;
}
.div1/*设置父div的样式,文本框和按键都在该父div中*/
{
margin-top:100px;
margin-left:250px;
position:fixed;/*设置父div为固定定位,使计算器在浏览器的具体位置中固定显示,不会随着滚动条的滚动而发生移动*/
box-shadow:3px 3px 3px gray;/*设置父div添加一个阴影*/
padding-bottom:8px;
padding-top:8px;
padding-left:20px;
background-color:green;
}
input[type="button"]
{
width:55px;
height:30px;
margin-right:5px;
margin-top:5px;
font-size:18px;
}
input[type="text"]
{
width:245px;
height: 50px;
font-size: 35px;
text-align: right;
background-color:white;
border:2px solid black;
margin-bottom:5px;
padding-right:5px;
}
/* 设置hover伪类选择器,使鼠标移动到input按键上时,按键背景色发生改变 */
input[type="button"]:hover
{
background-color:rgb(190,190,190);
border:none;
}
</style>
<script>
// 对计算器功能进行初始化
function init() {
// 获取指定id对应的元素
var num=document.getElementById("num");
// 获取元素的value属性值并进行修改
num.value=0;
// disabled="disabled"表示禁止在文本框输入,防止非数字内容的输入
num.disabled="disabled";
// 使用内置getElementsByTagName()函数获取所有input标签元素,返回一个数组
var OButton=document.getElementsByTagName("input");
for(var i=0;i<OButton.length;i++){
// 使用内部函数实现DOM事件
OButton[i].onclick=function(){
/*使用isNaN()判断某字符串内容能否强制转换为数字类型,this表示OButton[i]对象*/
//是数字的话则将其转化为Number显示在文本框中
if(!isNaN(this.value)){
num.value=(num.value+this.value)*1;
}
else
{
//有一些中间变量是可以不用声明直接使用的。声明后就会分配内存
var btn_num=this.value;
switch(btn_num){
case "平方":
btn_num6=Number(num.value);
num.value=Math.pow(btn_num6,2);
break;
case "开方":
btn_num7=Number(num.value);
if(btn_num7<0)
{
alert("负数不能开方");
}
else
{
num.value=Math.sqrt(btn_num7);
}
break;
case "清零":
num.value=0;
break;
case "back":
num.value=back(num.value);
break;
case "+/-":
num.value=sign(num.value);
break;
case "+":
/*获取文本框的内容为字符串,需使用内置函数Number()强制转换为数字类型*/
btn_num1=Number(num.value);
num.value=0;
fh="+";
break;
case "-":
btn_num2=Number(num.value);
num.value=0;
fh="-";
break;
case "×":
btn_num3=Number(num.value);
num.value=0;
fh="×";
break;
case "/":
btn_num4=Number(num.value);
num.value=0;
fh="/";
break;
case "%":
btn_num5=Number(num.value);
num.value=0;
fh="%";
break;
case ".":
num.value=decimal(num.value);
break;
case "=":
switch(fh){
case "+":
num.value=btn_num1+Number(num.value);
break;
case "-":
num.value=btn_num2-Number(num.value);
break;
case "×":
num.value=btn_num3*Number(num.value);
break;
case "/":
if(Number(num.value)!=0){
num.value=btn_num4/Number(num.value);
}else{
alert("除数不能为零(0)");
}
break;
case "%":
num.value=btn_num5%Number(num.value);
break;
}
break;
default:
break;
}
}
}
}
}
// 验证文本框是否为0或者为空
function isNull(n){
if(n=="0"||n.length==0){
return true;
}else{
return false;
}
}
// 小数点
function decimal(n){
if(n.indexOf(".")==-1){
n=n+".";
}
return n;
}
// 回退键
function back(n){
if (!isNull(n)) {
if(n.length==1){
n=0;
}else{
n=n.substr(0,n.length-1);
}
}
/*注意这个n是一个数字字符串,而不是一个数字*/
return n;
}
// 正负号
function sign(n){
// 法1: 通过字符串截取的内置函数实现正负号
/*if(n.indexOf("-")==-1){
n="-"+n;
}else{
n=n.substr(1,n.length);
}*/
// 法2: 通过强制转换的方式实现正负号
n=Number(n)*-1;
return n;
}
</script>
</body>
<script type="text/javascript" src="z.js">
</script>
小黑记事本
