怎样用JS提交一个Form

JavaScript016

怎样用JS提交一个Form,第1张

办法1.同一个页面中建立两个表单 各自提交:

<form action="?" name="form1" id="form1">

<!-- 表单内容 -->

<input type="submit" />

</form>

<form action="?" name="form1" id="form1">

<!-- 表单内容 -->

<input type="submit" />

</form>

办法2:如果非要只有一个表单的话,通过js提交:

<script type="text/javascript" language="javascript">

function submitYouFrom(path){

$('form1').action=path

$('form1').submit()

}

</script>

<form action="?" name="form1" id="form1">

<!-- 表单内容 -->

<input type="button" value="提交1" onclick="submitYouFrom('地址一')"/>

<input type="button" value="提交2" onclick="submitYouFrom('地址二')"/>

</form>

可以手动构建一个FormData进行表单提交,代码如下:

var form = new FormData()

//添加参数

form.append('name', 'jack')

form.append('age', 20)

//使用xmlhttprequest发起请求

var xhr = new XMLHttpRequest()

xhr.open('post', '这里添上请求的url', true)

xhr.onreadystatechange = function() {

    if(xhr.readyState == 4) {

        //成功

    }

}

//执行请求

xhr.send(form)

使用form表单提交数据,需要将数据写到表单元素内(如文本框、隐藏域等)。因此,将js文件里的变量通过FORM表单提交到action的思路如下:

1、在form表单中准备隐藏域用以存放需要提交的数据

<form action="目标url">

<!-- 其他表单元素 -->

<input type="hidden" id="test" name="testname">

<input type="submit" value="提交">

</form>

2、在js文件中,将变量赋值给隐藏域

var test = "...." // 需要提交的变量

document.getElementById("test").value = test

3、点击”提交按钮“提交表单后,后台可以接收name为testname,value为test变量的值的数据。