使用 jquery 显示/隐藏 div 时，TextBox 变得清晰答案

【问题标题】：TextBox Get clear when div show/hide using jquery使用 jquery 显示/隐藏 div 时，TextBox 变得清晰
【发布时间】：2011-12-28 04:57:35
【问题描述】：

我正在做一个项目，其中我有两个 DIV（DIV1、DIV2），两个都没有。动态创建的文本框。我必须隐藏其中一个 DIV。在另一个 DIV 单击事件中，我相应地显示这些 DIV 并在 DIV1 的这些文本框中输入一些文本。当我隐藏此 div1 并显示 DIV2 并在 DIV2 的某些文本框中输入一些文本并将其隐藏时。当我显示 DIV1 时，文本框为空。我希望这些文本框保留我在隐藏之前输入的值。 DIV2 也是如此。所有这些操作都是由 jquery 完成的，我需要 jquery 的帮助。

请任何人帮助我。提前致谢。

【问题讨论】：

您需要提供您的代码。
如果你想要标签之类的功能，你可以选择 jquery ui 标签

标签： javascript jquery

【解决方案1】：

您应该使用.css('display', 'none') 或.toggle() 隐藏您的divs。

您似乎正在删除它们，然后将新的添加到 DOM。

你能告诉我们你的代码吗？

【讨论】：

感谢您的快速回复，我将我的 Div 隐藏为 $('#DIV1').hide(); $('#DIV2').show();并且所有文本框都在这些 DIV 中
@Tanweer 我尝试使用 hide() 和 show() 但它保留了我在输入中的值

【解决方案2】：

试试类似下面的代码：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<style>
.container{
border:1px solid gray;
margin:10px;
}
p,input{margin:10px;}
</style>
<script type="text/javascript">
 $(document).ready(function(){
    $("#p1").click(function(){ $("#div2").toggle();});
    $("#p2").click(function(){ $("#div1").toggle();}); 
 });
</script>
</head>
<body>
<div class="container">
<p id="p1">Text in block2</p>
<div id="div1">
    <input type="text" value="Some text in div 1" class="c1" />
    <input type="text" value="Some text in div 1" class="c1" />
</div>
</div>
<div class="container">
<p id="p2">Text in block1</p>
<div id="div2">
  <input type="text" value="Some text in div 2" class="c2" size="20"/>
  <input type="text" value="" class="Some text in div 2" size="20"/>
</div>
</div>
</body>
</html>

【讨论】：

感谢 Umesh，我尝试了您的代码，它工作正常，但在我的情况下，所有文本框都是动态创建的，这些文本框不存在于 DIV1 和 DIV2 的内部 HTML 中，因此我的文本框仍在获取清除。 $(document).ready(function () { $('#MainDiv').click(function () { $('#DIV1').toggle(); $('#DIV2').toggle(); } ); });
@Tanweer，您能否提供 HTML 代码以显示如何动态创建输入。那么，我可以调试并让您知道解决方案如何进行？
现在已经解决了，实际上我在创建文本框的时候并没有设置它们的 value 属性。