Question

我正在尝试制作一个基于myform选中复选框的表单。

myform2应该具有相同输入字段的myform2的所有选中复选框。

我该怎么做？

<h1>Heading 1</h1>
<form name="myform" method="POST" action="/cgi-bin/script.cgi">
<input name="box1" type="checkbox" value="Bike" />
<input name="box2" type="checkbox" value="Car" />
</form> 
<h2>Heading 2</h2>
<form name="myform2" method="POST" action="/cgi-bin/script.cgi">
<script type="text/javascript">
var i=5;
var b=0;
while (b<=i) {
    document.write('<br />' + '<input type="checkbox"' + 'value="Bike"' + '/>' + '<label for="male">'+ "Male" + '</label>' )
}
</script>
</form>

Answer 1

您可以使用jquery在这些行中执行某些操作：

$('form:eq(0) input').clone().appendTo('form:eq(1)');

它应该克隆页面上第一个表单元素下的所有input dom元素，并将它们放到页面上的第二个表单元素中。没有测试过这个，但希望能做到你想要的。

如果您只想复制选中的输入元素，可以尝试以下方法：

$('form:eq(0) input:checked').clone().appendTo('form:eq(1)');

但是如果你已经检查了单选按钮，那么它也会克隆它们，如果你想要防止你必须更加漂亮，这将是：

$('form:eq(0) input:checkbox').filter(':checked').clone().appendTo('form:eq(1)');

这应该只复制复选框类型的输入元素并进行检查。

Answer 2

您可以在skorks' answer中看到的方式（在我看来）。但是如果除了没有库之外别无选择，那么这就是js。

<h1>Heading 1</h1>
<form name="myform" method="POST" action="/cgi-bin/script.cgi">
<input name="box1" type="checkbox" value="Bike" checked />
<input name="box2" type="checkbox" value="Car" />
</form> 

<h2>Heading 2</h2>
<form name="myform2" method="POST" action="/cgi-bin/script.cgi">

<script type="text/javascript">

var my_form = document.forms[0];
var num_inp = my_form.elements.length;
var me, i;
for (i=0; i<num_inp; i++) {
    me = my_form.elements[i];
    if(me.type === "checkbox" && me.checked)
    document.write('<input type="checkbox" value="' + me.value + '" name="' + me.name + '" checked /> ' + me.value + '<br/>');
}

</script>
</form>

顺便说一下，您不清楚在哪里获得生成的labels的{{1}}数据，最好的选择是checkboxes的{{1}}和我用过它。

Javascript如何根据其他表单制作表单

2 个答案: