JS实用代码收集

1、提交到新窗口：

 

<a href= "#" onclick= "window.open('','meizz','resizable=no,width=300,height=200');document.search.target='meizz';document.search.submit()">;">

 

 

2、动态绑定数组到下拉列表：

 

数据：

//#“银行”列表数据
var bank_datas = [['2','招商银行'],['15','上海银行'],['16','广东发展银行'],['17','深圳平安银行'],['18','中国银行'],['19','中国农业银行']
,['20','中国建设银行'],['21','中国工商银行'],['24','中国民生银行'],['25','交通银行']
,['26','兴业银行'],['27','宁波银行'],['28','中国光大银行'],['29','中信银行'],['30','北京银行'],['31','上海浦东发展银行']
,['32','华夏银行'],['33','深圳发展银行'],['34','花旗银行'],['35','渣打银行']];

 

调用：

            <select name= "select4" id= "select4">
             <option value= "0">银行</option>
                <script language= "javascript">
                getDatas_callback(bank_datas, "select4")
             </script>
            </select>

 

函数：

//#IE6 IE7能显示，FF不能显示
function     getDatas_callback2(res,name)
{
   //获得参数
   var     datas     = res;
   var     DropName =name;

   //用for循环给Select控件赋值
   for     ( var     i=0;i<datas.length;i++)
  {
    oOption     =     document.createElement( "OPTION");
    DropName.options.add(oOption);
    oOption.innerText     =     datas[i];
    oOption.value     =     datas[i];
  }
}

或者用：

//#静态输出以增强通用性（数据为二维数组）
function    getDatas_callback(res,name)
{
   //获得参数
   var     datas     = res;
   var     DropName = name;
   //用for循环给Select控件赋值
   for     ( var     i=0;i<datas.length;i++)
  {
    document.write( "<option value="+datas[i][0]+ ">"+datas[i][1]+ "</option>");
  }
}

 

 

3、单击下拉列表的实现整个div的切换

 

JS文件：

//#搜索栏“信用卡”和“贷款”的切换
function exchange(obj)
{
   var index=obj.value;
   //显示贷款
   if(index== "1")
  {
     //隐藏信用卡搜索栏
     var obj1=document.getElementById( "card");
    obj1.style.display= "none";
     //显示贷款搜索栏
     var obj2=document.getElementById( "loan");
    obj2.style.display="";
     //设置下拉列表值为“贷款”
     var obj3=document.getElementById( "select5");
    obj3.options[0].selected = false;
    obj3.options[1].selected = true;
    obj1= null;
    obj2= null;
    obj3= null;
  }
   //显示信用卡
   if(index== "0")
  {
     //隐藏贷款搜索栏
     var obj4=document.getElementById( "loan");
    obj4.style.display= "none";
     //显示信用卡搜索栏
     var obj5=document.getElementById( "card");
    obj5.style.display="";
     //设置下拉列表值为“贷款”
     var obj6=document.getElementById( "select1");
    obj6.options[0].selected = true;
    obj6.options[1].selected = false;
    obj4= null;
    obj5= null;
    obj6= null;
  }
  obj= null;
}

//#静态输出以增强通用性
function    getDatas_callback(res,name)
{
   //获得参数
   var     datas     = res;
   var     DropName = name;
   //用for循环给Select控件赋值
   for     ( var i=0;i<datas.length;i++)
  {
    document.write( "<option value="+datas[i][0]+ ">"+datas[i][1]+ "</option>");
  }
}

 

HTML代码：

< div align ="right" id ="card" >
             < select id ="select1" name ="select1" onchange ="exchange(this)" >
                     < option value ="0" >信用卡 </option>
                     < option value ="1" >贷款 </option>
             </select>    
             
             < select id ="select2" name ="select2"     >
                     < option value ="0" selected     >年费 </option>
                     < option value ="1" >180元以下 </option>
                     < option value ="2" >180-360元 </option>
                     < option value ="3" >360元以上 </option>
             </select>
                 
             < select name ="select3" id ="select3" >
         < script language ="javascript" >
        getDatas_callback(card_datas,"select3")
         </script>
             </select>
             
             < select id ="select4" name ="select4" >
                 < script language ="javascript" >
                getDatas_callback(bank_datas,"select4")
             </script>
             </select>
                 
</div>
< div align ="right" id ="loan" style ="display:none;" >
             < select id ="select5" name ="select5" onchange ="exchange(this)" >
                     < option value ="0"     >信用卡 </option>
                     < option value ="1"     >贷款 </option>
             </select>    
             
             < select id ="select6"     name ="select6" >
                     < option value ="0" selected >贷款属性一 </option>
                     < option value ="1"     >180元以下 </option>
             </select>       
</div>

 

4、利用Jquery传送post数据

//#post datas
function postdatas()
{
   //         $.blockUI('正在提交数据...');
   var select1 = $('#select1').val();
   var select2 = $('#select2').val();
   var select3 = $('#select3').val();
   var select4 = $('#select4').val();
   var params = {
    select1 : select1,
    select2 : select2,
    select3 : select3,
    select4 : select4
  };

  $.post( "./topsearch/?Command=Index",params, function(){
    alert( "数据发送成功过");
    window.location.href= "./topsearch";
  });

}

当然要先引用Jquery的库。

 

5.取得checkbox组的选中数目

<SCRIPT>
     function check()    
    {
   var index=0;
   for(i=1;i<9;i++)
    {
     if(document.getElementById( "idcheckbox"+i).checked == true)
      index++;
         }
     if(index==0){
            alert( "没有选中记录！");
    } else{
      alert( "选中的数目为："+index);
    }
    }

</SCRIPT>

<input name= "idcheckbox1" id= "idcheckbox1" type= "checkbox" >1</br>
<input name= "idcheckbox2" id= "idcheckbox2" type= "checkbox" >2</br>
<input name= "idcheckbox3" id= "idcheckbox3" type= "checkbox" >3</br>
<input name= "idcheckbox4" id= "idcheckbox4" type= "checkbox" >4</br>
<input name= "idcheckbox5" id= "idcheckbox5" type= "checkbox" >5</br>
<input name= "idcheckbox6" id= "idcheckbox6" type= "checkbox" >6</br>
<input name= "idcheckbox7" id= "idcheckbox7" type= "checkbox" >7</br>
<input name= "idcheckbox8" id= "idcheckbox8" type= "checkbox" >8</br>

<input value= "测试一" onClick= " check();" type= "button" >