关于javascript的两个重要的应用

javascript是web开发的一种重要的技术，用来进行客户端编程，是我最反感，也最薄落的一环，但是不得不承认它的强大功能，绝对值得一学。下面是两个重要的应用：

1、从框架的一个页面读取复框的值，到另一个页面

<script language ="javascript">
    function click1(){

        var name="";
        for(var i=0;i<document.frm.elements.length;i++){
            if(document.frm.elements[i].checked==true){
                name=name+document.frm.elements[i].value+",";
            }
        }
        window.parent.rbottom.location="input.jsp?name="+name;
    }

</script>

这里将值一请求字符串的方式发到另一页就可以用request对象获取；

2、不刷新当前页，直接根据一个复癣框的选择改变另一个复选框的选项

<script    src="js/comm/dataCheck.js"></script>
<script    src="js/comm/Constant.js"></script>
<script    src="js/comm/check.js"></script>
<script    src="js/comm/meizzDate.js"></script>
<script    src="js/comm/shareJs.js"></script>
<script    src="jsp/materiel/js/material_create_page.js"></script>
<link rel="stylesheet" href="css/edit.css">
<link rel="stylesheet"  href="css/card.css">

<title>物资管理</title>
<html:form action="materialAction.do">
<html:hidden property="material_id" />
<html:hidden property="postMSg" />
<html:hidden property="dataMark" />
<html:hidden property="bdsfwkMark" />
<html:hidden property="tjglState" />
<html:hidden property="postMethod" />
<fieldset>
 <legend align="center">物资管理__新增材料基本信息</legend>
 <table border="0"  align=center >

  <tr>
 <td>
     <table border="0" >
            <tr>
             <td class="left">材料代码</td>
                <td><html:text property="material_code"/><%=strRedMark%> </td>
                <td class="left">材料名称</td>
                <td><html:text property="material_name"/><%=strRedMark%></td>
            </tr>
            <tr>
                <td class="left">一级类别</td>
    <%
      TreeMap firstKindMap = (TreeMap)request.getAttribute("firstKindMap");
      Set firstKindSet = firstKindMap.keySet();
      Iterator firstKindIterator = firstKindSet.iterator();
      Iterator firstKindIterator1 = firstKindSet.iterator();
   %>
                <td>
                <html:select property="first_kind_id"  οnclick="doChange()" οnfοcus="doChange()">
                  <html:option value="">请选择....</html:option>
  <%
      while(firstKindIterator.hasNext()){
          String first_kind_id = (String)firstKindIterator.next();
          String first_kind_name = (String)firstKindMap.get(first_kind_id);
  %>
                <html:option value="<%=first_kind_id%>"><%=first_kind_name%></html:option>
  <%  }%>
                </html:select><%=strRedMark%></td>
                <td class="left">二级类别</td>
                <td>
                <html:select property="second_kind_id" >
                   <html:option value="">请选择....
                   </html:option>
                </html:select>
                </td>
            </tr>
            <tr>
             <td class="left">单位</td>
                <td><html:text property="m_unit"/></td>
                <td class="left">规格</td>
                <td><html:text property="spec"/></td>
            </tr>
            <tr>
                <td class="left">存放仓库</td>
                <td ><html:select property="wh_id">
                <html:options collection="WareHouseList" property="wh_id" labelProperty="wh_name" />
                </html:select><%=strRedMark%>
                </td>
                <td class="left">单价</td>
                <td><html:text property="unit_price"/></td>
            </tr>
            <tr>
               <td class="left">备注</td>
               <td colspan="3"><html:textarea property="remark" cols="50" rows="3"/></td>
            </tr>
        </table>
    </td>
  </tr>

  <tr>
          <td><div align="center">　
            <input type="button" οnclick="docSubmit();"
               name="btn_DocSubmit"
              value="确定" >&nbsp;
             <input type="reset" value="重置" name="B4">&nbsp;
               <input type="button"  οnclick="fh();" value="返回" name="B5">
          </div></td>
  </tr>
      <tr>
          <td colspan="2">
            注意事项：<br>
            1、所有带红色“<%=strRedMark%>”号的项目，必须输入<br>
            2、按“确定”按钮保存完基本资料后，才能添加一条记录<br>
          </td>
     </tr>
</table>
</fieldset>

<script>
iniFrm();
function doChange() {
   var myfrm =document.forms[0];
   switch (myfrm.first_kind_id.value) {
     case '':
          var labels=new Array("请选择...");
          var values=new Array("");
          break;
<%
    TreeMap dataMap = (TreeMap)request.getAttribute("dataMap");
    while(firstKindIterator1.hasNext()){
       String first_kind_id = (String)firstKindIterator1.next();
       out.println("case'"+first_kind_id+"':");
       TreeMap secondKindMap = (TreeMap)dataMap.get(first_kind_id);
       if (secondKindMap!= null){
   //      out.println("alert('"+secondKindMap+"')");
         Set secondKindSet = secondKindMap.keySet();
         Iterator secondKindIterator = secondKindSet.iterator();
         Iterator secondKindIterator1 = secondKindSet.iterator();
         out.print("var labels = new Array(/"请选择.../"");
         while(secondKindIterator.hasNext()){
            String second_kind_id = (String)secondKindIterator.next();
            String second_kind_name =(String)secondKindMap.get(second_kind_id);
   //         out.println("alert('"+second_kind_name+"')");
            out.print(",/""+second_kind_name+"/"");
         }
         out.println(");");
         out.print("var values = new Array(/"/"");
         while(secondKindIterator1.hasNext()){
            String second_kind_id = (String)secondKindIterator1.next();
            out.print(",/""+second_kind_id+"/"");
    //        out.println("alert('"+second_kind_id+"')");
         }
         out.println(");");
         out.println("break;");
       }
       else{
         out.println("var labels=new Array(/"请选择.../");");
         out.println("var values=new Array(/"/");");
         out.println("break;");
       }
     //  out.println("alert(/"asdfsd/");");
    }
%>
   // 清空市列表选择框的内容
   }
   myfrm.second_kind_id.options.length = 0;

   // 从数组中添加内容
   for(var i = 0; i <labels.length; i++) {
      myfrm.second_kind_id.add(document.createElement("OPTION"));
      myfrm.second_kind_id.options[i].text=labels[i];
      myfrm.second_kind_id.options[i].value=values[i];
   }
    // 选择第一个选项
     myfrm.second_kind_id.selectedIndex = 0;

}
</script>
</html:form>

这里将jsp和javascript合在一块写，调试起来极为困难，在加了一堆out.println("alert(/"asdfsd/");");
后终于成功了；