如何使用javascript隱藏jsp文件中的元素

Question

<li><label>Email:</label> <input type='text' name='username' 
          id="forgot_username" /></li> 
         <li><label>&nbsp;</label> <input type="submit" 
          id="forgot_btn" value="Send Reminder" class="btn"></li> 

我在上面的文本框和按鈕在我的jsp中。和下面的條件，我想要的是當這種情況發生時，上面的文本框和按鈕應該隱藏我該怎麼做。

<c:if test="${param.message == 3}"> 
         <span class="error"><font color="red"> Email does not match</font></span> 
        </c:if> 

Answer 1

你爲什麼不能把那些<li>元素在一個相同的構造？

如果你不能把這些元素結合在一起，不想重複的條件下，你總是可以定義一個新的變量：

<c:set var="condition" value="0"> 
<c:if test="${param.message == 3}"> 
    <c:set var="condition" value="1"> 
</c:if> 

<c:if test="${condition == 1}"> 
         <span class="error"><font color="red"> Email does not match</font></span> 
        </c:if> 

.... 

<c:if test="${condition == 1}"> 
<li><label>Email:</label> <input type='text' name='username' 
          id="forgot_username" /></li> 
         <li><label>&nbsp;</label> <input type="submit" 
          id="forgot_btn" value="Send Reminder" class="btn"></li> 
</c:if> 

這樣的<li>將會被隱藏，即使客戶端JS禁用，或任何類型的JS問題。

Answer 2

你應該把div標籤周圍的第一個這樣的代碼：

<div id="hide"> 
    <ol> 
     <li> 
      <label>Email:</label> 
      <input type='text' name='username' id="forgot_username" /> 
     </li> 
     <li> 
      <label>&nbsp;</label> 
      <input type="submit" id="forgot_btn" value="Send Reminder" class="btn"> 
     </li> 
    </ol> 
</div> 

然後你就可以隱藏這樣的：

<c:if test="${param.message == 3}"> 

    <script> 
     $('#hide').hide(); 
    </script> 

    <span class="error"><font color="red"> Email does not match</font></span> 
</c:if>