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

发布于 2024-12-07 12:15:15 字数 653 浏览 4 评论 0原文

<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>
<li><label>Email:</label> <input type='text' name='username'
                            id="forgot_username" /></li>
                        <li><label> </label> <input type="submit"
                            id="forgot_btn" value="Send Reminder" class="btn"></li>

I have above text box and button in my jsp. and the below condition, what i want is when this condition occur , above text box and button should hide how can i do it.

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

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

吹梦到西洲 2024-12-14 12:15:15

您应该在第一个代码周围放置 div 标签,如下所示:

<div id="hide"> 
    <ol>
        <li>
            <label>Email:</label>
            <input type='text' name='username' id="forgot_username" />
        </li>
        <li>
            <label> </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>

You should put div tags around the first code like this:

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

And then you can hide like this:

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

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

    <span class="error"><font color="red"> Email does not match</font></span>
</c:if>
掌心的温暖 2024-12-14 12:15:15

为什么不能将这些

  • 元素放入相同的构造中?
  • 如果你不能把这些元素放在一起并且不想重复条件,你总是可以定义一个新变量:

    <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> </label> <input type="submit"
                                id="forgot_btn" value="Send Reminder" class="btn"></li>
    </c:if>
    

    这样即使客户端有JS,这些

  • 也会被隐藏禁用,或任何类型的 JS 问题。
  • Why can't you put those <li> elements inside an identical construct?

    If you can't put those elements together and don't want to repeat the condition, you can always define a new variable:

    <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> </label> <input type="submit"
                                id="forgot_btn" value="Send Reminder" class="btn"></li>
    </c:if>
    

    This way those <li> will be hidden even if the client has JS disabled, or any kind of JS problem.

    ~没有更多了~
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文