1

我想使用相同的脚本函数隐藏多个 div。可以吗？我隐藏了一个 div...检查我的代码

html

 <div id="bookingDiv">
           <table><tr><td>

            <table>
                <tr>
            <td class="labelTd">
                        <label>Employee Name
                        </label>
                    </td>
                    <td class="fieldTd">
                        <input type="text" class="txt-med2" style="color: blue" name="txtEmployeeName"  id="txtEmployeeName" readonly tabindex="6" value="<%=strEmployeeName%>" size="11" maxlength="11" />

                    </td>

                   </tr>


                    <tr>
                    <td class="labelTd">
                        <label> Travel Date From
                        </label>
                    </td>
                    <td class="fieldTd">
                         <input type="text" class="txt-med2" style="color: blue"  id="txtDateFrom"   readonly name="txtDateFrom" size="11" maxlength="11" tabindex="4"    value="<%=strDateFrom%>"   style=" width : 136px;" />
                     </td>
                    </tr>
                    <tr>
                    <td class="labelTd">
                        <label> Purpose of Visit 
                        </label>
                    </td>

                    <td class="fieldTd">
                        <input type="text" class="txt-med2" style="color: blue"  name="txtPurposeOfVisit"  value="<%=strPurpose%>" class="textArea-Medium" tabindex="5" style=" width : 144px;"></input>
                    </td>
                    <td></td>
                </tr>

                </table>
                 </td>

           <td>
           <table>
            <tr>
            <td class="labelTd">
                        <label>Designation
                        </label>
                    </td>
                    <td class="fieldTd">
                        <input type="text" class="txt-med2" style="color: blue" name="txtDesignation"  readonly id="txtDesignation" tabindex="8" value="<%=strDesignation%>" size="11"  maxlength="11" />

                    </td>
                   </tr>
                   <tr>
            <td class="labelTd">
                        <label>Employee Grade
                        </label>
                    </td>
                    <td class="fieldTd">
                        <input type="text" class="txt-med2" style="color: blue" name="txtEmployeeGrade"  readonly id="txtEmployeeGrade" tabindex="7" value="<%=strEmployeeGrade%>" size="11" maxlength="11" />

                    </td>
                   </tr>


                      <tr>
            <td class="labelTd">
                        <label>Advance&nbsp;Amount Requested
                        </label>
                    </td>
                    <td class="fieldTd">
                        <input type="text" class="txt-med2" style="color: blue" name="txtAdvanceAmountReq"  readonly id="txtAdvanceAmountReq" tabindex="10" value="<%=approvedAmt%>" size="8"  maxlength="11" />

                    </td>
                   </tr>
                              <tr>
            <td class="labelTd">
                        <label>Additional&nbsp;Amount Requested
                        </label>
                    </td>
                    <td class="fieldTd">
                        <input type="text" class="txt-med2" style="color: blue" name="txtAdditionalAmountReq"  readonly id="txtAdditionalAmountReq" tabindex="11" value="<%=strAdditionalAmountReq%>" size="8" maxlength="11" />
                        </td>
                  </tr>
                   </table>

           </td>

            </tr>
            </table> 

            </div>

JavaScript 代码 

   function showDiv()
         {
    var tmp1=document.getElementById("txtTravelId");
    if(tmp1.value=="")
     {
        document.getElementById("bookingDiv").style.display = 'none';
            }
    else
    {
        document.getElementById("bookingDiv").style.display = 'block';
    }
         }
4

2 回答 2

3

Id 's是独特的。

如果您使用jQuery，那么 .You 可以class对所有 div 使用相同的。 $('.className').hide();

如果你想用 javascript 解决

在getElementsByClassName某些浏览器中有，但不像 getElementById 那样受到广泛支持。 看这里

否则，您可以为不同的 div 使用不同的 id，然后使用 id 隐藏

于 2013-05-16T12:56:41.957 回答
0

ID 应该是唯一值。但是，要将 div 组合在一起，您可以使用相同的类名。这是一个例子。

<div id="name" class="myClass">...</div>
<div id="address" class="myClass">...</div>
<div id="email" class="myOtherClass">...</div>

jQuery允许您像这样隐藏具有相同类名的多个元素

$(".myClass").hide();

这将隐藏name和addressdivs 但不是那个email。.show();使它们再次可见。

但是，根据您打算做什么，您可以将要隐藏的所有内容放在一个 div 中，然后简单地隐藏该 div。

于 2013-05-16T13:03:26.827 回答