1

在我的 jsp 页面中，我有两个 div 和一个带有默认值的文本框，如下所示

<input type="text" value="somevalue"  id="box"/>
<div id="first" style="display:none"></div>

<div id="second"></div>

在脚本标签中我写如下

<script>
$(document).ready(function()
{
    if($("#box").val()=='somevalue')
    {
        $('first').show();
        $('second').hide();
    }
});
</script>

上面的代码运行良好..但是当页面加载时，第二个 div 会持续 1 秒，然后切换到第一个 div..我不希望出现这种切换..

4

5 回答 5

0

应该是这样的，你缺少 id 选择器。选择器中的“#”

$('#first').show();
$('#second').hide();
于 2013-01-31T09:22:52.437 回答
0

在您的 HTML 中，将所有 div 更改为隐藏。

<input type="text" value="somevalue"  id="box"/>
<div id="first" style="display:none"></div>

<div id="second" style="display:none"></div>

然后在你的 JQuery 中。

$(document).ready(function()
{
      // show only the boxes based on your conditions. This is just an example.
    if($("#box").val()=='somevalue')
    {
        $('#first').show();
    }
    else
    {
        $('#second').show();
    }
});
于 2013-01-31T09:26:27.137 回答
0

您可以将 style="display:none" 设置为两个 div，然后根据该值显示 div。

<input type="text" value="somevalue"  id="box"/>
<div id="first" style="display:none"></div> 
<div id="second" style="display:none"></div>


<script>
$(document).ready(function()
{
    if($("#box").val()=='somevalue') { $('#first').show(); }
    else  { $('#second').show(); }
});
</script>
于 2013-01-31T09:28:12.330 回答
0 
$("#first,#second").css("display", "none");
($("#box").val() == 'somevalue' ? $('#first').show(); : $('#second').show();)
于 2013-01-31T09:30:17.023 回答
0

您说它在JSP页面中，因此您可以将条件逻辑放入服务器端，并确定两个<div>元素中的哪一个应该在它到达浏览器之前隐藏。绝对没有理由使用 jQuery 来解决这个问题，这样做（在我看来）是错误的方法。

假设您使用的是JSTL 核心标签库：

<c:set var="yourValue" value="somevalue"/>
<input type="text" value="somevalue"  id="box"/>
<div id="first" <c:if test="${yourValue != 'somevalue'}">style="display:none"</c:if>></div>

<div id="second" <c:if test="${yourValue == 'somevalue'}">style="display:none"</c:if>></div>
于 2013-01-31T09:30:28.650 回答