用html制作用户信息注册,[网页设计]html用户注册界面

[网页设计]html用户注册界面

0 2016-08-06 10:00:05

先上一张简约的界面的效果图

这里是style里面的内容

再来body里面的内容,这里用到的是失焦 onblur  和聚焦 onfocus

用户注册

---

用户名:">

密码:

确认密码:

邮箱:

我已阅读注册手册

最后是js里面的代码

function name1(){

var name=document.getElementById("name").value;

if(name.length==""){

document.getElementById("tel").innerHTML="用户名不能为空"

document.getElementById("tel").style.color="red";

}else{

document.getElementById("tel").innerHTML="√"

document.getElementById("tel").style.color="green";

}

}

//function name2(){

//document.getElementById("tel").innerHTML="请填写用户名"

//document.getElementById("tel").style.color="#999";

//}

function pwd2(){

document.getElementById("pw").innerHTML="请填写6-12位的密码"

document.getElementById("pw").style.color="#999";

}

function pwd1(){

p=document.getElementById("paswd").value;

if(p.length>=6&&p.length<=20)

{

document.getElementById("pw").innerHTML="√"

document.getElementById("pw").style.color="green";

}else{

document.getElementById("pw").innerHTML="格式错误,请输入6-20位"

document.getElementById("pw").style.color="red";

}

}

function validate(){

var qpw=document.getElementById("paswd").value;

var qpw2=document.getElementById("paswd2").value;

if(qpw==qpw2 && p.length>=6&&p.length<=20){

document.getElementById("qpwtx").innerHTML="√";

document.getElementById("button").disabled = false;

}

else {

document.getElementById("qpwtx").innerHTML="两次密码不相同或者格式错误";

document.getElementById("button").disabled = true;

}

}

大家如果有需要可以借鉴一下，觉得还不错的朋友们点击一下推荐吧

转载请保留本文网址：http://www.shaoqun/a/245104.html

*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：admin@shaoqun。

HTML

0