Javascript的一些相关应用

    网页开发中，总是碰到一些页面的控制，本文就一些本人在开发过程中遇到的一些javascript的一些相关应用做出总结，希望以后能更加完善

一、复选框问题<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />

 

<script language = “javascript“>
<!--
function InCheckAll()                                  ///检查确认复选框是否全选或全不选
{
  if( 其他子复选框都选了 )
    formname.checkboxname.checked=true;
  else
       formname.checkboxname.checked=false;}
function InSelectAll()                                  ///主复选框一选其他全选，
{
  if(   其他子复选框都选了 )
   {
     document.formname.element[i]=false;                ///利用for循环
   }
  else
   {
      document.formname.element[i]=true;                ///利用for循环
   }
}
 

}
 

//-->
</script>
 

二、历史记录回退一步用：

<a href="javascript:history.back();"><img src="../images/return.gif" width="72" height="21" border="0" alt="返回">
</a>
javascript:history.back();－－－－在input type="button" onclick='javascript:history.back()’>可以直接用，不用再设javascript函数
 

三、主下拉菜单一选某项，子下拉菜单都选该项

提示：直接把子下拉菜单的地址跟主下拉菜单的地址一一对应就行了
例：
function changeall()
       {
       form.selectChild.selectedIndex=form.selectFather.selectedIndex;            ////// selectedIndex 属性则给出了被用户选中的那个选项在 options 数组中的下标
       }
 

<
1913d
font size="2">四、一个radio组和一个按钮，选定了某项radio再由按钮触发事件跳到其他页面

代码：
方法一：

function RadioNotyet(radioname,total,content){
///if radio group has not been motified return -1,else return the selected index
 

       for(j=0;j<total;j++){
              if(radioname[j].checked==true)return j;
       }//for
       alert("还没选择"+content);
       return -1;
}//function RadioNot
 

function NextStep()                                                   ///用到脚本函数的相互调用
{
                           
switch(RadioNotyet(radio1,2,"下一步去哪里?"))
{
  case -1:return;
  case 0:location="GreenPassStep2.htm";break;
  case 1:location="GreenPassStep3.htm";break;
}
}
 

方法二：

if (!document.formNAME.RadioGroup1[0].checked&&!document.formNAME.RadioGroup1[1].checked&&!document.formNAME.RadioGroup1[2].checked)
   alert("请选择你要进行的方式!");
  
   else if(document.formNAME.RadioGroup1[0].checked)
   location="MemberPassStep3.html";
  
   else if(document.formNAME.RadioGroup1[1].checked)
   location="MemberPassStep4.html";
  
   else if(document.formNAME.RadioGroup1[2].checked)
   location="MemberPassStep6.html";
   }
 

五、依次判断文本框的内容是否为空并且是否填写正确信息

方法一（直接每个写上代码）：

<script language="JavaScript">
   function jump()

   {
   var patrn2=/^(/w){6,20}$/;     ///此为正则表达式，判断是否6～20位，测试密码用的
                              ///其实也可以这样:if(document.formName.PasswordName.value.length<6||document.formName.PasswordName.value.length>20) alert('输入密码长度不对');
                                                   
                                              
   var patrn3=/^(/w){6,20}$/;
   if (document.formname.textfieldname.value=="")        ///若是单个文本框

       {
          alert("请填写详细配送地址！");
          document.formname.textfieldname.focus();
       }///.focus表示定位鼠标焦点
         
   else if (document.form.textfieldname[0].value=="")      ///若为一系列文本框，可用数组
       {
          alert("请填写订件人姓名！");
          document.formname.textfieldname[i].focus();
       }///i是变量
         
     ……
         
        var patrn2=/^[a-zA-Z0-9 ]{3,12}$/;                ///以下都是利用正则表达式判断信息输入是否无误
        var patrn3=/^[0-9]{1,20}$/;
             if (!patrn2.exec(document.formame.textfieldname[4].value)||!patrn3.exec(document.formame.textfieldname[4].value))
                alert("请输入正确的邮编!");
         else location="GreenPassStep7.htm";
     }
 

   else if (!patrn2.exec(document.formame.textfieldname[6].value))
   alert("请输入6-20个字母、数字、下划线 !");
 
   else if (!patrn3.exec(document.formame.textfieldname[7].value))
   alert("请输入6-20个字母、数字、下划线 !");
  
   else  location="GreenPassStep7.htm";
} 
 

方法二（利用脚本函数的相互调用）：

例如：
 

 function TextNotyet(textname,content){//if text has not been  motified return－1
       if(textname.value==""){
              alert("还没填写"+content);
              return -1;
       }
       else return 0;
}//function TextNotyet
 

 

function Login()

{
//登陆确定按钮 textfield,textfield2,textfield3

       if(TextNotyet(textfield,"会员用户名")||TextNotyet(textfield2,"登陆密码")||TextNotyet(textfield3,"校验密码"))    //调用了TextNotyet()
           return;
       location="MemberPassStep2.html";                                                                //跳转
             

}
 

        
</script>
 

 

七、下拉菜单

Dreamweaver本身有这个下拉菜单跳转函数生成模板，例如：
 
  <select name="网站搜索表2" onChange="MM_jumpMenu('parent',this,1)">  
    <option value="../wzss.htm" selected><font size="5">网站搜索</font></option>  
    <option value="../whjy-bd.htm"><font size="5">文化教育</font></option>  
  </select>  
  <input type="button" name="搜索表按钮" value="前往" onClick="MM_jumpMenuGo('网站搜索表2','parent',1)">  
 

注意：在这个“MM_jumpMenuGo('网站搜索表2','parent',1)”函数里，第一个参数为表单元素seleceNAME，第二个是traget，即是
是否在本窗口或另一个新窗口打开，第三个参数是決定是否設定"Select First Item After URL Change"(0-->取消, 1-->設定)
还有下拉菜单的"option value"必须为要打开的页面文件名！
另外，系统还会自动生成三个函数，应该是层函数。
 

八、表单提交数据方法有两种

第一：直接通过表单的<form>里面的action="相关页面"和submit提交按钮来处理。
第二：如是图片按钮的话，就让图片连接到一个javascript函数，像这样：<a href="javascript:function();"></a>
            然后在function()那里用这个语句来提交表单数据：document.formname.submit();（由于我们这次把所有按钮换成图片，这种方法
      可能我们要用得多点！）
 

下面某一论坛说明表单提交的方法：

post提交
所有的post提交只能在form中产生，提交方式又分两种：直接提交(submit提交)、间接提交（脚本提交）

1）直接提交：点击提交按钮，立即发生提交
<form method=post action=*.asp>
<input type=submit value=”注册”>
注：submit按钮有一个默认事件，就是提交
<input type=submit value=”注册” onclick=”alert(‘hello’);return ture or false;”>
注：在提交前，首先在屏幕上返回一个警告框”hello”，若return的是true，则页面发生提交；若return的是false，页面不会发生提交。
</form>

2）间接提交：是指点击按钮本身并不能完成提交，而只有通过脚本才能完成的提交，称为间接提交。
<input type=button value=”注册” onclick=”check();submit();”>
注：
在onclick处还可为onmousedown、onmouseup等事件名称
button只是普通按钮，本身并不能发生提交，只能通过onclick指定的脚本程序才能完成提交
点击“注册”后，先执行onclick事件触发的函数，若返回值为true则发生提交，否则提交中止。

 

九、日、月下拉菜单

 

两个脚本函数如下：
function change_it()
{
　get_select=FrontPage_Form1.select_month.selectedIndex;
　select_item_m=FrontPage_Form1.select_month.options[get_select].text
　switch(select_item_m)
  {
　 case '2月': MD(28);break;
　 case '4月':
　 case '6月':
　 case '9月':
　 case '11月': MD(30);break;
　 default: MD(31);break;
　}
}  ////function change_it

 

function MD(days)
{
　j=FrontPage_Form1.select_day.options.length;
　for(k=0;k<j;k++) FrontPage_Form1.select_day.options.remove(0);
　for(i=0;i<days;i++)
 {
　 var day=document.createElement("OPTION");
　 FrontPage_Form1.select_day.options.add(day);
　 day.innerText=i+1;
 }
}  ////function MD()

 

十、form表单元素的取法

例如：
<form name="orderdata" action="/cgi-bin/order.cgi" method="post">
Item Number: <input name="itemnumber" type="text"><br>
Quantity: <input name="quantity" type="text"><br>
<input type="submit" value="Update"><input type="reset" value="Clear">
</form>

 

要使用名为 'quantity' 的元素，可以使用下边三种方法中的任何一种：

var e = document.forms["orderdata"].elements[1];
var e = document.forms.orderdata.elements["quantity"];
var e = document.orderdata.quantity;

 

十一、利用函数window.open()可以打开一个新页面

 

function gotourl(name)

{

    var url = "http://www.163.com";

    window.open(url);

    return true;

}

 

 

 

 

onSubmit='return checkform();'

 

 1.这个语句可以让按钮回到前一页面。

<input type=button name="Submit2" value="返回" onClick = 'javascript:history.back()'>

 

 

 

2.可以在没有form的情况下就跳转

 <input type="button" name="Submit2" value="提交" onclick = 'javascript:location.href="http://www.163.com"'>

 

 

3.javascript的跳转

 

function gotourl(name)

{

    //var url="http://sms.21cn.com/sms_self_edit.jsp?Msg=xx&phone=xx"+ smsform.Phone.value + "&Msg=" + smsform.Msg.value;

    //window.open(url, "sms", " toolbar=yes, menubar=yes, scrollbars=yes, resizable=yes, location=yes, status=yes");

    var url = "http://www.163.com";

    var url1 = "http://www.sohu.com";

    if(name =="Submit3")

        window.open(url);

    if(name =="Submit32")

     window.open(url1);

    return true;

}

 

 

4.function ischecked()

{

if(document.form5.checkbox1.checked)

{

document.write("ajfas;kfafj");

}

}

 

5.在javascript中用location="http://www.sohu.com";可以跳转而不重开一个页面。

6.

function check()

{

var url="MyphotoMoneyBuySetModifyResult.htm";

 window.open(url, "", " toolbar=no, menubar=no, scrollbars=yes, resizable=no, location=no, status=no");

}

 

function Confirm(){

if(confirm('你确定不冲印了吗?'))

location.href="../index.html";

}

 

function isdelete()

{

window.confirm("是否删除");

}

 

7在图片上鼠变手形。

style = "cursor:hand";

onmouseover = this.style.cursor='hand';

javascript:document.form.reset;可以重置。

 

8．取得IP地址：String ip = request.getRemoteAddr();