js动态创建form以post方式提交

最新推荐文章于 2021-12-29 10:53:09 发布
原创 最新推荐文章于 2021-12-29 10:53:09 发布 · 1.2k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #ViewUI

本文介绍了一种使用JavaScript动态创建并提交表单的方法。通过创建一个隐藏的`form`元素并将其附加到页面上，可以实现指定URL的POST请求。这种方法可用于在不刷新整个页面的情况下提交数据。

<script >
//js动态创建form 提交表单
function formSubmit(elementValue) {

    var turnForm = document.createElement("form");  
    //一定要加入到body中！！  
    document.body.appendChild(turnForm);
    turnForm.method = 'post';
 turnForm.action = '/product/detail.htm';
 turnForm.target = '_blank';
 //创建隐藏表单
 var newElement = document.createElement("input");
    newElement.setAttribute("name","id");
    newElement.setAttribute("type","hidden");
    newElement.setAttribute("value",elementValue);
    turnForm.appendChild(newElement);
 
    turnForm.submit();
}

</script>

 

<a href="javascript:formSubmit('1')">点击我</a>

使用 JavaScript 提交表单（Form）的完整指南
CyberOI的博客
09-29 1380
通过监听表单的提交事件，并在事件处理函数中获取表单字段的值，你可以对表单数据进行处理，比如发送到服务器进行保存或进行其他操作。在网页开发中，表单（Form）是一种常见的交互元素，它允许用户输入数据并将其发送到服务器进行处理。接下来，我们将使用 JavaScript 来捕获表单的提交事件，并编写处理函数来提交表单数据。通过将上述代码保存为 HTML 文件并在浏览器中打开，你将能够看到一个包含文本输入框和提交按钮的表单。最后，我们执行了提交操作，这里只是简单地将获取到的数据打印到控制台中。
JavaScript高级 - 纯js实现文件上传大文件切片上传断点续传（客户端）
lixiaosenlin的专栏
03-18 7703
文章目录前言一、环境准备及依赖库二、项目结构三、 功能实现1、axios二次封装2、 单文件上传FROM-DATA，先选文件再上传3、 单文件上传BASE64，只能上传小于100K的png或jpg图片文件4、多文件上传FORM-DATA5、多文件拖拽上传FORM-DATA6、大文件切片上传，断点续传FORM-DATA总结 前言 在另一篇文章JavaScript高级 - nodejs+koa2实现文件上传大文件切片上传断点续传(服务器端)中已经介绍了文件上传的服务器端实现，并实现了几个不同上传形式的服务
JavaScript动态创建form表单并提交的实现方法
10-23
主要介绍了JavaScript动态创建form表单并提交的实现方法,涉及JavaScript动态创建页面元素及模拟表单提交的技巧,需要的朋友可以参考下
怎样用js创建Form表单并提交
weixin_34167819的博客
09-07 138
var f = document.createElement("form"); document.body.appendChild(f); var i = document.createElement("input"); i.type = "hidden"; f.appendChild(i); i.value = "5"; i.name = "price"; f.action = ".
javascript动态创建form表单
TO
03-13 372
//helper function to create the form function getNewSubmitForm(){var submitForm = document.createElement("FORM");document.body.appendChild(submitForm);submitForm.method = "POST";return submitForm;}//h...
js动态生成form 并用ajax方式提交的实现方法
11-24
在JavaScript中，动态生成表单（form）以及使用Ajax方式提交数据是一种常见的需求，尤其是在页面交互和异步数据处理中。下面将详细解释这个过程，包括如何创建动态表单、添加表单元素以及如何利用Ajax进行提交。 ...
jquery实现动态创建form并提交的方法示例
10-16
// 原生JavaScript实现动态创建Form并提交 var dlform = document.createElement('form'); dlform.style = "display:none;"; dlform.method = 'post'; dlform.action = '../fileServlet'; dlform.target = '...
JavaScript 创建一个 form 表单并提交
热门推荐
NULL BLOG
06-26 2万+
页面布局有些复杂的情况下，可能需要在页面中动态创建一个 form，JavaScript 创建 form 演示如下： // JavaScript 构建一个 form function MakeForm() { // 创建一个 form var form1 = document.createElement("form"); form1.id = "form1"; ...
js创建Form表单并提交
mmoxmoai的博客
09-16 1649
//js动态创建form 提交表单 function formSubmit(elementValue) { var turnForm = document.createElement("form"); //一定要加入到body中！！ document.body.appendChild(turnForm); turnForm.method = 'post'
Javascript动态生成Form表单
Wiki.M's development
03-21 835
主要是在利用Struts中的DispatchAction开发的使用，用于隐藏方法参数。因为在使用DispatchAction的时候，可能在地址栏会暴露后台方法名，所以采用了这种动态生成Form表单，并利用Post方式提交的方法对DispatchAction中的方法参数进行隐藏。这样在超链接或者利用button进行提交的时候可以在一定程序上对后台代码方法进行隐藏。当然这种方法也并不能做到绝对的方法隐...
js创建表单提交
Choco1ove的博客
12-29 1101
var form = document.createElement(‘form’); form.style = “display:none;”; form.method = ‘post’; form.action = ‘login/userLogin.html’; var inputEl = document.createElement(‘input’); inputEl.type = ‘hidden’; inputEl.name = ‘xxxName’; inputEl.value = ‘xxxValue
html表单通过js提交表单提交,JavaScript动态创建form表单并提交的实现方法
weixin_29985807的博客
06-20 644
本文实例讲述了JavaScript动态创建form表单并提交的实现方法。分享给大家供大家参考，具体如下：页面布局有些复杂的情况下，可能需要在页面中动态创建一个 form，JavaScript 创建 form 演示如下：// JavaScript 构建一个 formfunction MakeForm(){// 创建一个 formvar form1 = document.createElement("...
js动态生成form表单并提交
a1470037986的博客
01-31 1万+
在提交json数据时，可能会出后台无法解析数据的bug，碰到这个不要怕，在提交数据前用js转一下json就好了，下面我写的代码里有转json的代码，如果只是传单个数据，就没必要写成json格式了。 $("#exceldown").click(function() { var data5 = []; //获取当前页的数据行 var rows = $('#month_
使用js，根据对象数组中对象属性值的不同将数组进行分组-2
qq_42127308的博客
06-11 1467
需求：将下面数组-对象中的index_name相同的对象抽离出来，放入一个新数组中 let tempArr = [ { domain: 'a', index_name: '云淡风轻' }, { domain: 'b', index_name: '递归' }, { domain: 'c', index_name: '云淡风轻' }, { domain: 'd', index_na...
JS window.open 参数示例
mingwei
02-16 581
简介　　window.open(url, name, features, replace) 　　Arguments - 参数　 　　url 　　可选字符串参数，指向要在新窗口中显示的文档的URL。如果省略该参数，或者参数为空字符串，新窗口不会显示文档。 　　name 　　可选字符串参数，该参数可以设置新窗口的名称。 　　相同name的窗口只能创建一个，要想创建多个窗口则name...
JavaScript操作form表单
zyt1204732670的博客
07-18 449
1. 获取输入的值 <input id="aa" /> <input type="button" value="查询" onclick="t1()" /> <script> document.getElementById("aa").focus(); function t1() { var element = document.getElementById("aa"); console.log(eleme
js 中 new FormData 的使用
勿忘初心
04-26 8256
一、概述 FormData 对象的使用： 1.用一些键值对来模拟一系列表单控件：即把form中所有表单元素的name与value组装成 一个queryString 2. 异步上传二进制文件。 二、使用 1.FormData对象的操作方法，全部在原型中，自己本身没任何的属性及方法。 let formData = new FormData() formData.append(
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值