JavaScript动态添加数据到表单并提交的几种方式

最新推荐文章于 2023-07-05 10:26:41 发布

暮　色

最新推荐文章于 2023-07-05 10:26:41 发布

阅读量2.6k

点赞数

分类专栏：前端 JavaScript 文章标签： JavaScript 表单

本文链接：https://blog.csdn.net/infotw/article/details/93780950

版权

本文探讨两种情况下的JavaScript动态表单操作：已存在form对象时如何添加元素并提交，以及如何在无form对象时生成并提交。同时，还介绍了使用jQuery AJAX进行表单提交以及非表单形式的数据提交，以及利用FormData动态添加数据并提交的方法。

摘要由CSDN通过智能技术生成

情景1：已经存在form对象了，动态为form增加对象并提交

function formAppendSubmit(){
        var myform=$('#newArticleForm'); //得到form对象
        var tmpInput=$("<input type='text' name='blogArticleForm.articleContent'/>");
        tmpInput.attr("value", myUeditor.window.getContentInsideBody());
        myform.append(tmpInput);
        myform.submit();
}

情景2：没有form对象，动态生成form，动态添加数据并提交

function(event){
        form = $("<form></form>")
        form.attr('action',action)
        form.attr('method','post')
        input1 = $("<input type='hidden' name='input1' />")
        input1.attr('value','input1 value')
        input2 = $("<input type='text' name='textinput' value='text input' />")
        form.append(in