<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    表單驗證

    <form name="formTest" action="#">
    ??<input type="checkbox" id="w1" name="box" value="0" />男
    ??<input type="checkbox" id="w2" name="box" value="0" />女
    ??<input type="checkbox" id="w3" name="box" value="0" />外鄉人</br>
    ??<input type="button" value="ok" onclick="w1.checked='checked';w2.checked='checked';w3.checked='checked'"/>
    簡單的按一個鍵,所有的check都被選中.

    下面的這個是關于表單驗證的一個作業.需要分析:就是在一個TEXT聚焦的時候,就會在旁邊顯示一排字告訴你里面內容必須不為空,并且要大于或者等于8位.當你輸入的內容符合要求的時候,該行字就自動小時.我算是基本實現了功能了,但是不完善.因為當我輸入9個字的時候,字并不是自動小時的,而是需要我再一次的聚焦..如果那位達人能幫忙解決下,俺感激不盡..
    代碼如下:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

    <html xmlns="?<head>
    ??<!-- Created by TopStyle Pro Trial Version -
    www.bradsoft.com -->
    ??<title></title>
    ??<style>
    ???div
    ???{
    ????color: red;
    ????font-size: 13px;
    ???}
    ???
    ???
    ??
    ??</style>
    ??<script>
    ???function tixing()
    ???{
    ????
    ????var divObject = document.getElementById("div1");
    ????var text= document.getElementById("t1");
    ????if(text.value.length >=8)
    ????{
    ????divObject.innerHTML = "您輸入的用戶名必須在0-8位之間。";
    ????divObject.style.display = "none";
    ????}?
    ????else
    ????{
    ????divObject.innerHTML = "您輸入的用戶名必須在0-8位之間。";
    ????divObject.style.display = "";
    ????}
    ????
    ???}?
    ???function tixing1()
    ???{
    ????var divObject1 = document.getElementById("div2");
    ????var text2= document.getElementById("t2");
    ????if(text2.value.length >=8)
    ????{
    ????divObject1.innerHTML = "您輸入的用戶名必須在0-8位之間。";
    ????divObject1.style.display = "none";
    ????}?
    ????else
    ????{
    ????divObject1.innerHTML = "您輸入的用戶名必須在0-8位之間。";
    ????divObject1.style.display = "";
    ????}
    ???}
    ???function validate()
    ???{
    ????var te1 = document.getElementById("t1")
    ????var te2 = document.getElementById("t2")
    ????var divObject = div1;
    ????var divObject1 = div2;
    ????
    ????if(te1.value.length < 8)
    ????{
    ?????divObject.innerHTML = "您輸入的用戶名必須在0-8位之間。";
    ?????divObject.style.display = "";
    ????}????
    ????
    ????if(te2.value.length < 8)
    ????{
    ?????divObject1.innerHTML = "您輸入的密碼必須在0-8位之間"
    ?????divObject1.style.display = "";
    ????}
    ????
    ????if(te1.value.length < 8 && te2.value.length < 8)
    ????{
    ????divObject.innerHTML = "您輸入的用戶名必須在0-8位之間。";
    ????divObject1.innerHTML = "您輸入的密碼必須在0-8位之間"
    ????divObject.style.display = "";
    ????divObject1.style.display = "";
    ????}
    ???}
    ???
    ??</script>
    ?</head>

    ?<body>
    ??<form id="formTest">
    ???用戶名
    ???<input type="text" id="t1"? onfocus="tixing();"/><br /><div id="div1"? ></div>
    ???密&nbsp碼?
    ???<input type="password" id="t2"? onfocus="tixing1()" /><br /><div id="div2"></div>
    ???<input type="button" id="bt1" value="登錄" onclick="validate()"/>
    ??</form>
    ?</body>
    </html>


    再下面的這個是今天的作業.
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

    <html xmlns="<head>
    ?<!-- Created by TopStyle Pro Trial Version -
    www.bradsoft.com -->
    ?<title></title>
    ?<style>
    ?div
    ?{
    ??float: left;
    ?}
    ?</style>
    ?<script>
    ??function a()
    ??{
    ???var textId0 = document.getElementById("te1");
    ???var text0 = textId0.value;
    ???var areId = document.getElementById("text");
    ???areId.value = areId.value+"1."+"用戶名:"+text0+"\n";
    ???
    ??}
    ??function b()
    ??{
    ???var textId1 = document.getElementById("pa");
    ???var text1 = textId1.value;
    ???var areId = document.getElementById("text");
    ???areId.value =areId.value+"3."+"密碼:"+text1+"\n";
    ??}
    ??function c()
    ??{
    ???var radioId1 = document.getElementById("ra1");
    ???var radio1 = radioId1.value;
    ???var areId = document.getElementById("text");
    ???areId.value =areId.value+"4."+"單選:"+radio1+"\n";
    ??}
    ??function d()
    ??{
    ???var radioId2 = document.getElementById("ra2");
    ???var radio2 = radioId2.value;
    ???var areId = document.getElementById("text");
    ???areId.value =areId.value+"4."+"單選:"+radio2+"\n";
    ??}
    ??function ei()
    ??{
    ???var radioId3= document.getElementById("ra3");
    ???var radio3 = radioId3.value;
    ???var areId = document.getElementById("text");
    ???areId.value =areId.value+"4."+"單選:"+radio3+"\n";
    ??}
    ??function f()
    ??{
    ???var checkId1= document.getElementById("che1");
    ???var check1 = checkId1.value;
    ???var areId = document.getElementById("text");
    ???areId.value =areId.value+"5."+"多選:"+check1+"\n";
    ??}
    ??function g()
    ??{
    ???var checkId2= document.getElementById("che2");
    ???var check2 = checkId2.value;
    ???var areId = document.getElementById("text");
    ???areId.value =areId.value+"5."+"多選:"+check2+"\n";
    ??}
    ??function h()
    ??{
    ???var checkId3= document.getElementById("che3");
    ???var check3 = checkId3.value;
    ???var areId = document.getElementById("text");
    ???areId.value =areId.value+"5."+"多選:"+check3+"\n";
    ??}
    ??function select()
    ??{
    ???var a = document.getElementById("selectId");
    ???var b = a.options[a.selectedIndex];
    ???var c = b.value;
    ???var? areId = document.getElementById("text");
    ??
    ???areId.value = areId.value+c;
    ??}
    ?</script>
    </head>

    <body>
    ?
    ??<div>
    ???用戶名:<input type="text" id="te1" onblur="a()"/><br/>
    ???密&nbsp&nbsp碼:<input type="password" id="pa" onblur="b();"/><br />
    ???<a>
    ???<input type="radio" value="吃飯" id="ra1" name="1" onblur="c();"/>吃飯
    ???<input type="radio" value="睡覺" id="ra2" name="1" onblur="d();"/>睡覺
    ???<input type="radio" value="上學" id="ra3" name="1" onblur="ei();"/>上學
    ???</a><br />
    ???<a>
    ???<input type="checkbox" id="che1" value="巷巷" onblur="f()"/>巷巷
    ???<input type="checkbox" id="che2" value="街道" onblur="g()"/>街道
    ???<input type="checkbox" id="che3" value="邊邊" onblur="h()"/>邊邊
    ???</a><br />
    ???<textarea id="text" cols="20" rows="6"></textarea>
    ??</div>
    ??<form id="selectId0">
    ???<select id="selectId" onblur="select()"; / >
    ????<option value="東東">東東? </option>
    ????<option value="南南">南南</option>
    ????<option value="西西">西西 </option>
    ????<option value="北北">北北 </option>
    ???</select>
    ??</form>
    ?
    </body>
    </html>

    還是不完善..哎..

    posted on 2006-12-07 22:14 閱讀(211) 評論(0)  編輯  收藏


    只有注冊用戶登錄后才能發表評論。


    網站導航:
     
    <2006年12月>
    262728293012
    3456789
    10111213141516
    17181920212223
    24252627282930
    31123456

    導航

    統計

    常用鏈接

    留言簿(1)

    隨筆檔案

    搜索

    最新評論

    閱讀排行榜

    評論排行榜

    主站蜘蛛池模板: 亚洲成在人线aⅴ免费毛片| 77777亚洲午夜久久多喷| 国产A∨免费精品视频| 免费乱码中文字幕网站| www亚洲精品久久久乳| 日美韩电影免费看| 苍井空亚洲精品AA片在线播放| 国产精品嫩草影院免费| 黄色网址大全免费| 自拍偷自拍亚洲精品情侣| 日本免费A级毛一片| 精品亚洲麻豆1区2区3区| 在线视频精品免费| 亚洲精品色播一区二区 | 亚洲国产免费综合| 久久国产亚洲精品麻豆| 免费毛片a线观看| 亚洲欧洲精品一区二区三区| 中文字幕av无码无卡免费| 亚洲av永久无码精品秋霞电影秋| mm1313亚洲国产精品美女| 91免费在线视频| 亚洲精品熟女国产| 在线观看免费a∨网站| 免费无码又爽又黄又刺激网站 | 国产精品jizz在线观看免费| 免费无码国产在线观国内自拍中文字幕| 久久久久亚洲av成人无码电影| 久久青草免费91观看| 亚洲av成人综合网| 亚洲成?v人片天堂网无码| 国产成人精品无码免费看 | 亚洲人成免费电影| 国产zzjjzzjj视频全免费| 黄网站免费在线观看| 亚洲天堂免费在线| 亚洲日韩中文字幕日韩在线| **毛片免费观看久久精品| 亚洲成熟丰满熟妇高潮XXXXX | 国产国产人免费人成免费视频| 在线看片免费人成视频久网下载 |