将值从一个html表单移动到另一个html表单，因此一个表单从其自身提交值，而另一表单从其提交值 [英] move value from one html form to another, so one form submits values from itself and another form

问题描述

我有2个html表单，即formA和formB.我想在提交B时同时提交A和B的值.这是我尝试的代码:

I have 2 html forms, formA and formB. I want to submit both A's and B's values when B is submitted. Here is the code I tried:

<script>
function combine()
{
formB=document.getElementById('formB').elements;
formA=document.getElementById('formA').elements;
formB[2]=formA[0];
return true;
}
</script>

<form name=A id=formA>
mydrink: <input type=text value=beer name=mydrink><br>
</form>

<br>

<form name=B id=formB action=forms.html method=get>
bar: <input type=text name=bar value=doogans><br>
<input type=submit onclick="return combine();" value=okie>
</form>

我想要的行为是在提交表单B时，它会发布bar和mydrink的值，因此生成的URL是

The behavior I want is so that when form B is submitted, it posts the values for bar and mydrink, so the resulting url is

forms.html?bar=doogans&mydrink=beer

但我只是得到

forms.html?bar=doogans

该代码看起来应该可以工作，但显然不行.你知道我在做什么错或忘记做吗?谢谢！

The code looks like it should work, but clearly does not. Do you know what I am doing wrong or forgetting to do? Thanks!

推荐答案

如果您正在探索 jQuery ，提交 formB 时，可以使用以下方法提取所有 formA 元素.

If you're exploring jQuery, here's how you can pull all the formA elements when formB is submitted.

HTML

HTML

<form name=A id=formA>
    mydrink: <input type=text value=beer name=mydrink /><br />
</form>
<br />
<form name=B id=formB action=forms.html method=get>
    bar: <input type=text name=bar value=doogans /><br />
    <input type=submit value=okie />
</form>

jQuery

jQuery

$(function() {
    $( '#formB input[type = "submit"]' ).on( 'click', function( e ) {
        $.each( $( '#formA' ).prop( 'elements' ), function( idx, elem ) {
            $( '#formB' ).append( $( '<input />' ).attr({
                type : "hidden",
                name : elem.name,
                value : elem.value
            }));
        });
    });
});

正在运行的演示: JsFiddle.net (悬停在工具栏上在iframe中查看提交后的查询参数)

这篇关于将值从一个html表单移动到另一个html表单，因此一个表单从其自身提交值，而另一表单从其提交值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！