用Jquery的append动态添加的input的值，重置后会被清空。

aa2222 2015-06-25 10:00:08

我在初始化表单的时候用Jquery的append动态添加了隐藏域，并赋值。
比如：
$(function(){
var input= '<input type="hidden" name="new2" id="new2" value=“11111111"/>';
$('form').append(input);
});

但是，触发表单重置事件reset的时候，这个隐藏域的值被清空了，而非动态添加的隐藏域没有受到影响，请问，jquery的append方法添加元素的机制是什么，是先添加一个空值的元素然后再赋值的吗？如何能让这个隐藏域的值在重置表单的时候不被清空呢？求解决啊，急急急~~~~

...全文

478 6 打赏收藏举报

写回复

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

aa2222 2015-06-25

打赏
举报

我在想，会不会是append添加元素的机制问题，不是一下子写入值，而且先创建了元素，后赋值，所以重置方法就默认这个动态添加的隐藏域值初始化的时候是空值的？

aa2222 2015-06-25

打赏
举报

引用 2 楼 zy205817 的回复:



<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script>
    $(function(){
      $("#in").click(function(){
	   var input= '<input type="text" name="new2" id="new2" value=“11111111"/>';
        $(this).append(input);
      })
    })
  </script>
</head>
<body>
  <div class="look"><h1>hello</h1></div>
  <div>
    <form name="form" method="post" action="">
      <div id="in">click</div>
	  <input type="reset" /> 
    </form>
  </div>

</body>
</html>

不会出现你说的问题

谷歌和火狐不会被清空，但是IE下就不行，会是隐藏域的原因吗？但是原来的非动态添加的隐藏域不会被清空啊。

aa2222 2015-06-25

打赏
举报

是IE的，真的被清空了。原来的隐藏域old不会被清空，只有append动态添加的隐藏域被清空了，我分别在重置前后alert了new2的值，真的没了。


<form id="inputForm" name="inputForm"  action="" method='post' onSubmit="return false;">
  		<input type="hidden" name="old" id="old" value="${old}" />
                <input id="submitBtn" type="submit" value="保存" />
                <input id="resetBtn" type="reset" value="重置" />
</form>

娃都会打酱油了 2015-06-25

打赏
举报

估计LZ是IE吧

码无边 2015-06-25

打赏
举报



<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script>
    $(function(){
      $("#in").click(function(){
	   var input= '<input type="text" name="new2" id="new2" value=“11111111"/>';
        $(this).append(input);
      })
    })
  </script>
</head>
<body>
  <div class="look"><h1>hello</h1></div>
  <div>
    <form name="form" method="post" action="">
      <div id="in">click</div>
	  <input type="reset" /> 
    </form>
  </div>

</body>
</html>

不会出现你说的问题