求助编写一点javascript,点击按钮后调用某个图片（如素材\images\loading.gif）

水平有限，JS只是有限？请教各位问题需要编写一段：
编写javascript，完成注册页面输入项正确性的验证过程。 
a) 使用客户端javascript脚本，判断用户名必须是英语字母或数字，长度6－12，如错误则弹出提示框，提示“请输入6-12位用户名”； 
b）使用客户端javascript脚本，判断电子邮件是否符合带有“@”字符，如错误则弹出提示框，提示“请输入正确电子邮件”； 
c) 单击“同意以下条款，提交注册信息”按钮后，调用“素材\images\loading.gif”，模拟显示前，后台交互进程 普通网页代码如下：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<!-- saved from url=(0014)about:internet --> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>zc.gif </title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<!--Fireworks 8 Dreamweaver 8 target.  Created Mon Dec 10 09:44:35 GMT+0800 2007--> 
<style type="text/css"> 
<!-- 
td { 
font-size: 12px; 
line-height: 2; 
} 
.red { 
color: #FF0000; 
} 
.border { 
border: 2px solid #cccccc; 
} 
.STYLE1 {color: #666666} 
--> 
</style> 
</head> 
<body bgcolor="#ffffff"> 
<table border="0" cellpadding="0" cellspacing="0" width="780"> 
<!-- fwtable fwsrc="未命名" fwbase="zc.gif" fwstyle="Dreamweaver" fwdocid = "1563999206" fwnested="0" --> 
  <tr> 
  <td> <img src="images/spacer.gif" width="43" height="1" border="0" alt="" /> </td> 
  <td> <img src="images/spacer.gif" width="102" height="1" border="0" alt="" /> </td> 
  <td> <img src="images/spacer.gif" width="21" height="1" border="0" alt="" /> </td> 
  <td> <img src="images/spacer.gif" width="419" height="1" border="0" alt="" /> </td> 
  <td> <img src="images/spacer.gif" width="161" height="1" border="0" alt="" /> </td> 
  <td> <img src="images/spacer.gif" width="34" height="1" border="0" alt="" /> </td> 
  <td> <img src="images/spacer.gif" width="1" height="1" border="0" alt="" /> </td> 
  </tr>   <tr> 
  <td rowspan="7">&nbsp; </td> 
  <td> <img src="images/zc-1.gif" alt="用户注册" width="102" height="64" /> </td> 
  <td colspan="2" background="images/zc-4.gif">&nbsp; </td> 
  <td background="images/zc-4.gif">&nbsp; </td> 
  <td rowspan="7">&nbsp; </td> 
  <td> <img src="images/spacer.gif" width="1" height="64" border="0" alt="" /> </td> 
  </tr> 
  <tr> 
  <td colspan="2"> <img src="images/zc-2.gif" width="123" height="65" /> </td> 
  <td colspan="2" valign="bottom">（带 <span class="red">* </span>的为必填项） </td> 
  <td> <img src="images/spacer.gif" width="1" height="65" border="0" alt="" /> </td> 
  </tr> 
  <tr> 
    <td colspan="4"> <table width="100%" border="0" cellpadding="0" cellspacing="0" class="border"> 
      <tr> 
        <td width="25%" align="left">想要的用户名： <span class="red">* </span> </td> 
        <td width="30%"> <input name="textfield" type="text" id="textfield" size="20" /> </td> 
        <td>4-20字符（包括小写字母、数字、中文），一个汉字为两个字符， <span class="red">请使用中文会员名 </span> </td> 
      </tr> 
    </table> </td> 
    <td> <img src="images/spacer.gif" width="1" height="51" border="0" alt="" /> </td> 
  </tr> 
  <tr> 
  <td colspan="4"> <table width="100%" height="100" border="0" cellpadding="0" cellspacing="0"> 
    <tr> 
      <td> <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
        <tr> 
          <td height="50" align="center"> <span class="STYLE1">提示：您可以先检查您想要的用户名是否已经被别人注册 </span> </td> 
        </tr> 
        <tr> 
          <td height="50" align="center"> <input type="button" name="button" id="button" value="检查会员名是否可用" /> </td> 
        </tr> 
      </table> </td> 
    </tr> 
    <tr> 
      <td align="center"> 
      </td> 
    </tr> 
  </table> </td> 
  <td> <img src="images/spacer.gif" width="1" height="79" border="0" alt="" /> </td> 
  </tr> 
  <tr> 
  <td> <img name="zc_r5_c2" src="images/zc-3.gif" width="102" height="70" border="0" id="zc_r5_c2" alt="" /> </td> 
  <td colspan="3" valign="bottom">（带 <span class="red">* </span>的为必填项） </td> 
  <td> <img src="images/spacer.gif" width="1" height="70" border="0" alt="" /> </td> 
  </tr> 
  <tr> 
  <td colspan="4"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
      <td>&nbsp; </td> 
      <td>&nbsp; </td> 
    </tr> 
    <tr> 
      <td>&nbsp; </td> 
      <td>&nbsp; </td> 
    </tr> 
    <tr> 
      <td>提示问题： <span class="red">* </span> 
        <select name="select" id="select"> 
          <option>==请选择提示问题== </option> 
                  </select> </td> 
      <td>&nbsp; </td> 
    </tr> 
    <tr> 
      <td>&nbsp; </td> 
      <td>&nbsp; </td> 
    </tr> 
    <tr> 
      <td>&nbsp; </td> 
      <td>&nbsp; </td> 
    </tr> 
    <tr> 
      <td>您的性别： <span class="red">* 
          <input type="radio" name="radio" id="radio" value="radio" /> 
        </span>男 
        <span class="red"> 
<input type="radio" name="radio2" id="radio2" value="radio2" /> 
</span>女 </td> 
      <td>&nbsp; </td> 
    </tr> 
    <tr> 
      <td>电子邮件地址： <span class="red">* </span> 
        <input type="text" onChange="check_email(this.value);"> </td> 
      <td>推荐电子邮件： <a href="http://mail.qq.com">QQ邮箱 </a>， <a href="http://mail.sogou.com">sogou邮箱 </a> </td> 
    </tr> 
    <tr> 
      <td height="50" colspan="2" align="center"> 
<INPUT TYPE="button" value='检查会员名是否可用' onclick="reP()"> </td> 
      </tr> 
  </table> </td> 
  <td> <img src="images/spacer.gif" width="1" height="348" border="0" alt="" /> </td> 
  </tr> 
  <tr> 
  <td colspan="4">&nbsp; </td> 
  <td> <img src="images/spacer.gif" width="1" height="57" border="0" alt="" /> </td> 
  </tr> 
</table> 
</body> 
</html> 

解决方案 »

  1.   


    function checkusername(username){
         var reg = new RegExp("^[0-9a-zA-Z]{6,12}$");
         if(!reg.test(reg)){
            alert("请输入6-12位用户名！");
            document.getElementById("username").focus();
            return false;
         }
         return true;
    }
    function checkemail(email){
         var reg = new RegExp("[a-z0-9A-Z]+@[a-z0-9A-Z]+\.[a-z0-9A-Z]+");
         if(!reg.test(email)){
             alert("请输入正确的email!");
             document.getElementById("email").focus();
             return false;
         }
         return true;
    }
    图片可放在一个DIV里面，把DIV隐藏。display:none,z-index:3
    function show(id){
         document.getElementById(id).style.display='block';
    }
      

  2.   

    感谢热心会员zhoupuyue的帮忙~~~~，我自己修改了一下，验证EMAIL那个可以了~~请问能否给个完整的验证6到12位用户名的“文本字段代码”和按钮的代码呢？？谢谢
    下面这个事验证EMAIL的，可以用了
    <script language="JavaScript">
    function checkemail(email){
         var reg = new RegExp("[a-z0-9A-Z]+@[a-z0-9A-Z]+\.[a-z0-9A-Z]+");
         if(!reg.test(email)){
             alert("请输入正确的email!");
             document.getElementById("email").focus();
             return false;
         }
         return true;
    }
    </script>
    表单文本字段
    <input type=text onblur=isEmail(this.value)>
    按钮
    <input type="submit" name="submit" id="submit" value="同意以下条款，提交注册信息 " />