将输入值从一种形式复制到另一种形式(其中每种形式的输入都具有相同名称)的最佳方法是什么?我提出了以下建议,但效率似乎非常低(我知道效率可能并不重要,但仍然想知道)。谢谢
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Testing</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#copy').click(function(){
var form1=$('#form1').find(':input');
var form2=$('#form2');
form1.each(function() {
var $t=$(this);
form2.find('[name="'+$t.attr('name')+'"]').val($t.val());
});
});
});
</script>
</head>
<body>
<button id="copy">copy</button>
<form id="form1">
<input name="a" type=text>
<input name="b" type=text>
<input name="c" type=text>
<input name="d" type=text>
</form>
<form id="form2">
<input name="a" type=text>
<input name="b" type=text>
<input name="c" type=text>
<input name="d" type=text>
</form>
</body>
</html>
您无需克隆或替换,只需更改 value
jQuery(function( $ ) {
function copyForms( $form1 , $form2 ) {
$(':input[name]', $form2).val(function() {
return $(':input[name=' + this.name + ']', $form1).val();
});
}
$('#copy').on('click', function() {
copyForms( $('#form1') , $('#form2') );
});
});
/*this demo only*/
body{display:flex;}form{padding:16px;background:#ddd;}form>*{box-sizing:border-box;width:100%;}
<form id=form1>
FORM
<input name=a type=text value="FOO">
<input name=b type=button value="BAR">
<textarea name=c>BAZ</textarea>
<select name=d>
<option value="a">a</option>
<option value="b" selected>b</option>
</select>
</form>
<button id="copy">COPY→</button>
<form id=form2>
HIDDEN FORM
<input name=a type=text>
<input name=b type=button value="...">
<textarea name=c></textarea>
<select name=d>
<option value="a">a</option>
<option value="b">b</option>
</select>
</form>
<script src="//code.jquery.com/jquery-3.1.0.min.js"></script>
:input[name]
您可以确保仅 定位:input
具有name
属性的s$(':input[name]', form2)
=的后代 #form2
val
回调,您可以定位目标输入中的每个输入:inputs
的#form1
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句