javascript写注册检测验证

html代码:

<tr>
                        <td>
                           用户名&nbsp;&nbsp;&nbsp;<input type="text" id="sname">
                           <span class="word"></span>
                        </td><br>
                    </tr>
                    <tr>
                        <td>
                            密码&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="password" id="spassword1">
                            <span class="word"></span>
                        </td><br>
                    </tr>
                    <tr>
                        <td>
                            密码确认&nbsp;&nbsp;<input type="password" id="spassword2">
                            <span class="word"></span>
                        </td><br>
                    </tr>
                    <tr>
                        <td>
                            电话号码&nbsp;&nbsp;<input type="text" id="tel">
                            <span class="word"></span>
                        </td><br>
                    </tr>
                    <tr>
                        <td>
                            性别&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="ssex" value= "男" checked><input type="radio" value= "女" name="ssex"><br>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            详细地址<br><br>
                            <textarea rows="5" cols="30" id="adds"></textarea>
                            <span class="word"></span>
                        </td>
                    </tr>
                    <tr>
                        <td id="hobbys">
                            爱好&nbsp;&nbsp;&nbsp;&nbsp;
                            <input type="checkbox" name="shobby" value="体育"/> 体育
                            <input type="checkbox" name="shobby" value="音乐"/>音乐
                            <input type="checkbox" name="shobby" value="文学"/>文学
                            <input type="checkbox" name="shobby" value="其他"/>其他
                            <span class="word"></span>
                        </td><br>
                    </tr>
                    <tr>
                        <td>
                            学历&nbsp;&nbsp;&nbsp;&nbsp;
                            <select id="sedu">
                            <option value="小学">小学</option>
                            <option value="初中">初中</option>
                            <option value="高中">高中</option>
                            <option value="大学">大学</option>
                            </select><br>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="checkbox" id="agreebox">我同意此协议
                            <span class="word"></span>
                        </td><br>
                    </tr>

js代码:

function checksname()//检测用户名
{
    var sname = document.getElementById("sname");
    if(sname.value=="")//检测用户名事都为空
    {
        sname.parentNode.getElementsByTagName("span")[0].innerHTML="用户名输入不能为空!";
        return false;
    }
    else
    {
        sname.parentNode.getElementsByTagName("span")[0].innerHTML="√";
        return true;
    }
}   

function checkpassword1()//检测密码
{ 
    var password1 = document.getElementById("spassword1");  
    if(password1.value=="")//检测密码是否为空
    {
        password1.parentNode.getElementsByTagName("span")[0].innerHTML="密码输入不能为空!";
        return false;
    }
    else if(password1.value.length > 10)//检测密码长度不能超过10个字符
    {
        password1.parentNode.getElementsByTagName("span")[0].innerHTML="密码长度不能超过10个字符!";
        return false;
    }
    else if(password1.value.length < 6)//检测密码长度不能少于6个字符
    {
        password1.parentNode.getElementsByTagName("span")[0].innerHTML="密码长度至少6个字符!";
        return false;
    }
    else
    {
        password1.parentNode.getElementsByTagName("span")[0].innerHTML="√";
        return true;
    }
}

function checkpassword2()//检测确认密码
{
    var password1 = document.getElementById("spassword1");
    var password2 = document.getElementById("spassword2");
    if(password2.value=="")//检测密码是否为空
    {
        password2.parentNode.getElementsByTagName("span")[0].innerHTML="请再次输入密码!";
        return false;
    }
    else if(password2.value.length > 10)//检测密码长度不能超过10个字符
    {
        password2.parentNode.getElementsByTagName("span")[0].innerHTML="密码长度不能超过10个字符!";
        return false;
    }
    else if(password2.value.length < 6)//检测密码长度不能少于6个字符
    {
        password2.parentNode.getElementsByTagName("span")[0].innerHTML="密码长度至少6个字符!";
        return false;
    }
    else if(password1.value != "" && password2.value != "" && password1.value != password2.value)
    {//检测两次输入密码是否相同
        password2.parentNode.getElementsByTagName("span")[0].innerHTML="两次输入的密码不相同,请重新输入!";
        return false;
    }
    else
    {
        password2.parentNode.getElementsByTagName("span")[0].innerHTML="√";
        return true;
    }
}

function checktel()//检测电话号码
{
    var tel=document.getElementById("tel");
    if(tel.value=="")//检测电话号码是否为空
    {
        tel.parentNode.getElementsByTagName("span")[0].innerHTML="请输入电话号码!";
        return false;
    }
    else if(tel.value.length != 11)//检测电话号码长度
    {
        tel.parentNode.getElementsByTagName("span")[0].innerHTML="电话号码长度不正确!";
        return false;
    }
    else if(isNaN(tel.value))//检测电话号码是否为数字
    {
        tel.parentNode.getElementsByTagName("span")[0].innerHTML="电话号码输入不是数字!";
        return false;
    }
    else
    {
        tel.parentNode.getElementsByTagName("span")[0].innerHTML="√";
        return true;
    }

}

function checkadds()//检测地址
{
    var adds =document.getElementById("adds");
    if(adds.value=="")
    {
        adds.parentNode.getElementsByTagName("span")[0].innerHTML="请输入您的地址!";
        return false;
    }
    else
    {
        adds.parentNode.getElementsByTagName("span")[0].innerHTML="√";
        return true;
    }
}

function checkhobbys()//检测爱好
{
    var hobbys = document.getElementById("hobbys");
    var shobby = hobbys.getElementsByTagName("input");
    if(shobby[0].checked == false && shobby[1].checked == false &&
        shobby[2].checked == false && shobby[3].checked== false)
    {
        hobbys.getElementsByTagName("span")[0].innerHTML="请选择您的爱好!";
        return false;
    }
    else
    {
        hobbys.parentNode.getElementsByTagName("span")[0].innerHTML="√";
        return true;
    }
}

function checkagreebox()//检测同意协议
{
    var agreebox = document.getElementById("agreebox");
    if(agreebox.checked == false)
    {
        agreebox.parentNode.getElementsByTagName("span")[0].innerHTML="“请同意此协议”不能为空!";
        return false;
    }
    else
    {
        agreebox.parentNode.getElementsByTagName("span")[0].innerHTML="√";
        return true;
    }
}

function checkall()//检测全部
{
    if(checksname() && checkpassword1() && checkpassword2() && checktel() && checkadds()
       && checkhobbys() && checkagreebox())
    {
        alert("注册成功啦,快去登录吧!");
        return true;
    }
    else 
    {
        return false;
    }
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章