谁能帮我看看这个问题

Question

这是我jsp页面中
 <logic:iterate id="item" name="romList" >
                      <html:form action="room" method="post">
<html:hidden property="method" value="doStateEdit"/>
                      <html:hidden property="id" value="${item.roomId}"/>
    
                      <logic:equal  name="item" property="state" value="空闲">
                     
               <tr align="center"  class="green">
            <td class="row">${item.bianhao }</td>
            <td class="row">${item.frame.frmName }</td>
            <td class="row">${item.area }</td>
            <td class="row">${item.state }</td>
            <td class="row">${item.stateChangeTime }</td>
            <td class="row">
            <select name="rom.state" id="rom.state"  onchange="change()">
                     <option value="">---</option>
                     <option value="空闲" class="green">空闲</option>
                     <option value="入住" class="red">入住</option>
                     <option value="长租" class="blue">长租</option>
                     <option value="预定" class="purple">预定</option>
                     <option value="故障" class="grey">故障</option>
                   </select>&nbsp;&nbsp;&nbsp;
   <button class="button" onClick="javascript:submit();">提交</button> 
           </td>
          </tr>
           </logic:equal >
<div id="Layer1" style="display:none">
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>从当前日期开始预订到
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" />
    (YYYY-MM-DD)</p>
</div>

<script language="javascript"> 
function change(){
   var sel=document.getElementById("rom.state");
   var divInput=document.getElementById('Layer1');
   var index=sel.selectedIndex;
   var value=sel.options[index].value;
   if(value=='预定'){
  divInput.style.display='block';
   }
   else if(value!='预定'){
      divInput.style.display='none';
   }
}
</script>
           </html:form>
          </logic:iterate>
编译后的生成的源文件<form name="roomForm" method="post" action="/landi/room.do">
     <input type="hidden" name="method" value="doStateEdit">
     <input type="hidden" name="id" value="20">
            <tr align="center" class="white">
            <td class="row">G1409</td>
            <td class="row">一室一卫（单间）</td>
            <td class="row">44.0</td>
            <td class="row">办公</td>
            <td class="row">2009-04-16 13:30:53</td>
            <td class="row"><select name="rom.state" id="rom.state" [color=#000080]onchange="change()">
                     <option value="">---</option>
                      <option value="空闲" class="green">空闲</option>
                     <option value="入住" class="red">入住</option>
                     <option value="长租" class="blue">长租</option>
                     <option value="预定" class="purple">预定</option>
                     <option value="故障" class="grey">故障</option>
                   </select>&nbsp;&nbsp;&nbsp;
   <button class="button" onClick="javascript:submit();">提交</button> 
           </td>
          </tr>
           <div id="Layer1" style="display:none">
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>从当前日期开始预订到
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" />
    (YYYY-MM-DD)</p>
</div>

<script language="javascript"> 
function change(){
   var sel=document.getElementById("rom.state");
   var divInput=document.getElementById('Layer1');
   var index=sel.selectedIndex;
   var value=sel.options[index].value;
   if(value=='预定'){
  divInput.style.display='block';
   }
   else if(value!='预定'){
      divInput.style.display='none';
   }
}
</script>
           </form>[/color]
          
<form name="roomForm" method="post" action="/landi/room.do">
     <input type="hidden" name="method" value="doStateEdit">
     <input type="hidden" name="id" value="22">
            <tr align="center" class="white">
            <td class="row">G1415</td>
            <td class="row">一室一卫一厅（单套间）</td>
            <td class="row">72.0</td>
            <td class="row">办公</td>
            <td class="row">2009-04-16 13:30:39</td>
            <td class="row">
                 <select name="rom.state" id="rom.state" [color=#333399]onchange="change()">
                     <option value="">---</option>
                      <option value="空闲" class="green">空闲</option>
                     <option value="入住" class="red">入住</option>
                     <option value="长租" class="blue">长租</option>
                     <option value="预定" class="purple">预定</option>
                     <option value="故障" class="grey">故障</option>
                 </select>&nbsp;&nbsp;&nbsp;
<button class="button" onClick="javascript:submit();">提交</button> 
           </td>
          </tr>
           <div id="Layer1" style="display:none">
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>从当前日期开始预订到
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" />
    (YYYY-MM-DD)</p>
</div>

<script language="javascript"> 
function change(){
   var sel=document.getElementById("rom.state");
   var divInput=document.getElementById('Layer1');
   var index=sel.selectedIndex;
   var value=sel.options[index].value;
   if(value=='预定'){
  divInput.style.display='block';
   }
   else if(value!='预定'){
      divInput.style.display='none';
   }
}
</script>
</form>[/color]   
为什么第一个表单中的js脚本可以执行，而第二个表单中的js就不能执行了呢？       

Answer 1

关键：
在一个页面中虽然在不同地方定义，但是也不能有名称相同的JS函数，必须保证编译后JS函数的名称不相同，

Answer 2

那请问下struts的<html:form>标签名字属性怎么写的？

Answer 3

按照二位的意见改了
<form action="room" method="post" name="form0" id="form0">
          <input type="hidden" name="method" value=doStateEdit/>
          <input type="hidden" name="id" value=20/>
               <tr align="center" class="white">
            <td class="row">G1409</td>
            <td class="row">一室一卫（单间）</td>
            <td class="row">44.0</td>
            <td class="row">办公</td>
            <td class="row">2009-04-16 13:30:53</td>
            <td class="row"><select name="rom.state" id="rom.state" onchange="change0()">
                     <option value="">---</option>
                      <option value="空闲" class="green">空闲</option>
                     <option value="入住" class="red">入住</option>
                     <option value="长租" class="blue">长租</option>
                     <option value="预定" class="purple">预定</option>
                     <option value="故障" class="grey">故障</option>
                   </select>&nbsp;&nbsp;&nbsp;
   <button class="button" onClick="javascript:submit();">提交</button> 
           </td>
          </tr>
           <div id="Layer1" style="display:none">
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>从当前日期开始预订到
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" />
    (YYYY-MM-DD)</p>
</div>

<script language="javascript"> 
function change0(){
   var sel=document.getElementById("rom.state");
   var divInput=document.getElementById('Layer1');
   var index=sel.selectedIndex;
   var value=sel.options[index].value;
   if(value=='预定'){
  divInput.style.display='block';
   }
   else if(value!='预定'){
      divInput.style.display='none';
   }
}
</script>
          </form>
         
 
          <form action="room" method="post" name="form1" id="form1">
          <input type="hidden" name="method" value=doStateEdit/>
          <input type="hidden" name="id" value=22/>
               <tr align="center" class="white">
            <td class="row">G1415</td>
            <td class="row">一室一卫一厅（单套间）</td>
            <td class="row">72.0</td>
            <td class="row">办公</td>
            <td class="row">2009-04-16 13:30:39</td>
            <td class="row"><select name="rom.state" id="rom.state" onchange="change1()">
                     <option value="">---</option>
                      <option value="空闲" class="green">空闲</option>
                     <option value="入住" class="red">入住</option>
                     <option value="长租" class="blue">长租</option>
                     <option value="预定" class="purple">预定</option>
                     <option value="故障" class="grey">故障</option>
                   </select>&nbsp;&nbsp;&nbsp;
   <button class="button" onClick="javascript:submit();">提交</button> 
           </td>
          </tr>
           <div id="Layer1" style="display:none">
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>从当前日期开始预订到
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" />
    (YYYY-MM-DD)</p>
</div>

<script language="javascript"> 
function change1(){
   var sel=document.getElementById("rom.state");
   var divInput=document.getElementById('Layer1');
   var index=sel.selectedIndex;
   var value=sel.options[index].value;
   if(value=='预定'){
  divInput.style.display='block';
   }
   else if(value!='预定'){
      divInput.style.display='none';
   }
}
</script>
          </form>
可还是不行啊？第一个js脚本可以正常执行，而第二个js脚本不能执行。

Answer 4

<script language="javascript"> 
function change(_this,id){
  var divInput= document.getElementById(id)
  if(_this.value=='预定'){ 
  divInput.style.display='block'; 
  } 
  else { 
      divInput.style.display='none'; 
  } 
} 
</script> 
<form action="room" method="post" name="form0" id="form0"> 
          <input type="hidden" name="method" value=doStateEdit/> 
          <input type="hidden" name="id" value=20/> 
     <tr align="center" class="white"> 
            <td class="row">G1409 </td> 
            <td class="row">一室一卫（单间） </td> 
            <td class="row">44.0 </td> 
            <td class="row">办公 </td> 
            <td class="row">2009-04-16 13:30:53 </td> 
            <td class="row"> <select name="rom.state" id="rom.state" onchange="change(this,'Layer1')"> 
                    <option value="">--- </option> 
                    <option value="空闲" class="green">空闲 </option> 
                    <option value="入住" class="red">入住 </option> 
                    <option value="长租" class="blue">长租 </option> 
                    <option value="预定" class="purple">预定 </option> 
                    <option value="故障" class="grey">故障 </option> 
                  </select>&nbsp;&nbsp;&nbsp; 
  <button class="button" onClick="javascript:submit();">提交 </button> 
          </td>
          </tr> 
          <tr> 
          <td>
          <div id="Layer1" style="display:none"> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>从当前日期开始预订到 
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" /> 
    (YYYY-MM-DD) </p> 
</div> 
          </td>
          </tr> 
          </form>         
          <form action="room" method="post" name="form1" id="form1"> 
          <input type="hidden" name="method" value=doStateEdit/> 
          <input type="hidden" name="id" value=22/> 
              <tr align="center" class="white"> 
            <td class="row">G1415 </td> 
            <td class="row">一室一卫一厅（单套间） </td> 
            <td class="row">72.0 </td> 
            <td class="row">办公 </td> 
            <td class="row">2009-04-16 13:30:39 </td> 
            <td class="row"> <select name="rom.state" id="rom.state" onchange="change(this,'Layer2')"> 
                    <option value="">--- </option> 
                      <option value="空闲" class="green">空闲 </option> 
                    <option value="入住" class="red">入住 </option> 
                    <option value="长租" class="blue">长租 </option> 
                    <option value="预定" class="purple">预定 </option> 
                    <option value="故障" class="grey">故障 </option> 
                  </select>&nbsp;&nbsp;&nbsp; 
  <button class="button" onClick="javascript:submit();">提交 </button> 
          </td> 
          </tr> 
          <tr> 
          <td> 
          <div id="Layer2" style="display:none"> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>从当前日期开始预订到 
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" /> 
    (YYYY-MM-DD) </p> 
</div> 
          </td> 
          </tr> 
          </form> 

Answer 5

<script language="javascript"> 
function change(_this,id){
  var divInput= document.getElementById(id)
  if(_this.value=='预定'){ 
  divInput.style.display='block'; 
  } 
  else { 
      divInput.style.display='none'; 
  } 
} 
</script> 
<form action="room" method="post" name="form0" id="form0"> 
          <input type="hidden" name="method" value=doStateEdit/> 
          <input type="hidden" name="id" value=20/> 
     <tr align="center" class="white"> 
            <td class="row">G1409 </td> 
            <td class="row">一室一卫（单间） </td> 
            <td class="row">44.0 </td> 
            <td class="row">办公 </td> 
            <td class="row">2009-04-16 13:30:53 </td> 
            <td class="row"> <select name="rom.state" id="rom.state" onchange="change(this,'LayerG1409')"> 
                    <option value="">--- </option> 
                    <option value="空闲" class="green">空闲 </option> 
                    <option value="入住" class="red">入住 </option> 
                    <option value="长租" class="blue">长租 </option> 
                    <option value="预定" class="purple">预定 </option> 
                    <option value="故障" class="grey">故障 </option> 
                  </select>&nbsp;&nbsp;&nbsp; 
  <button class="button" onClick="javascript:submit();">提交 </button> 
          </td>
          </tr> 
          <tr> 
          <td>
          <div id="LayerG1409" style="display:none"> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>从当前日期开始预订到 
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" /> 
    (YYYY-MM-DD) </p> 
</div> 
          </td>
          </tr> 
          </form>         
          <form action="room" method="post" name="form1" id="form1"> 
          <input type="hidden" name="method" value=doStateEdit/> 
          <input type="hidden" name="id" value=22/> 
              <tr align="center" class="white"> 
            <td class="row">G1415 </td> 
            <td class="row">一室一卫一厅（单套间） </td> 
            <td class="row">72.0 </td> 
            <td class="row">办公 </td> 
            <td class="row">2009-04-16 13:30:39 </td> 
            <td class="row"> <select name="rom.state" id="rom.state" onchange="change(this,'LayerG1415')"> 
                    <option value="">--- </option> 
                      <option value="空闲" class="green">空闲 </option> 
                    <option value="入住" class="red">入住 </option> 
                    <option value="长租" class="blue">长租 </option> 
                    <option value="预定" class="purple">预定 </option> 
                    <option value="故障" class="grey">故障 </option> 
                  </select>&nbsp;&nbsp;&nbsp; 
  <button class="button" onClick="javascript:submit();">提交 </button> 
          </td> 
          </tr> 
          <tr> 
          <td> 
          <div id="LayerG1415" style="display:none"> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>从当前日期开始预订到 
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" /> 
    (YYYY-MM-DD) </p> 
</div> 
          </td> 
          </tr> 
          </form> 

Answer 6

<script language="javascript"> 
function change(_this){
  var divInput= _this.form.getElementsByTagName("div")[0]
  if(_this.value=='预定'){ 
  divInput.style.display='block'; 
  } 
  else { 
      divInput.style.display='none'; 
  } 
} 
</script> 
<form action="room" method="post" name="form" id="form"> 
          <input type="hidden" name="method" value=doStateEdit/> 
          <input type="hidden" name="id" value=20/> 
     <tr align="center" class="white"> 
            <td class="row">G1409 </td> 
            <td class="row">一室一卫（单间） </td> 
            <td class="row">44.0 </td> 
            <td class="row">办公 </td> 
            <td class="row">2009-04-16 13:30:53 </td> 
            <td class="row"> <select name="rom.state" id="rom.state" onchange="change(this)"> 
                    <option value="">--- </option> 
                    <option value="空闲" class="green">空闲 </option> 
                    <option value="入住" class="red">入住 </option> 
                    <option value="长租" class="blue">长租 </option> 
                    <option value="预定" class="purple">预定 </option> 
                    <option value="故障" class="grey">故障 </option> 
                  </select>&nbsp;&nbsp;&nbsp; 
  <button class="button" onClick="javascript:submit();">提交 </button> 
          </td>
          </tr> 
          <tr> 
          <td>
          <div id="Layer" style="display:none"> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>从当前日期开始预订到 
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" /> 
    (YYYY-MM-DD) </p> 
</div> 
          </td>
          </tr> 
          </form>         
          <form action="room" method="post" name="form" id="form"> 
          <input type="hidden" name="method" value=doStateEdit/> 
          <input type="hidden" name="id" value=22/> 
              <tr align="center" class="white"> 
            <td class="row">G1415 </td> 
            <td class="row">一室一卫一厅（单套间） </td> 
            <td class="row">72.0 </td> 
            <td class="row">办公 </td> 
            <td class="row">2009-04-16 13:30:39 </td> 
            <td class="row"> <select name="rom.state" id="rom.state" onchange="change(this)"> 
                    <option value="">--- </option> 
                      <option value="空闲" class="green">空闲 </option> 
                    <option value="入住" class="red">入住 </option> 
                    <option value="长租" class="blue">长租 </option> 
                    <option value="预定" class="purple">预定 </option> 
                    <option value="故障" class="grey">故障 </option> 
                  </select>&nbsp;&nbsp;&nbsp; 
  <button class="button" onClick="javascript:submit();">提交 </button> 
          </td> 
          </tr> 
          <tr> 
          <td> 
          <div id="Layer" style="display:none"> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>&nbsp; </p> 
  <p>从当前日期开始预订到 
    <input type="text" id="destine_edntime" name="destine_edntime" onClick="calShow('destine_edntime');" onFocus="calShow('destine_edntime');" style="width:110px" /> 
    (YYYY-MM-DD) </p> 
</div> 
          </td> 
          </tr> 
          </form>