情景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(input1)
form.append(input2)
form.appendTo("body")
form.css('display','none')
form.submit()
}

jquery ajax 提交表单

$.ajax({
type: "POST",
url: www.baidu.com,
data: $('#formId').serialize(),
success: function (data) { },
error: function(data) { }
});

jquery ajax 非表单形式

$.ajax({
type:"post",
url: "login.action",
data: "name="+user + "&chatRoomId="+chatRoomId,
success:
function(){ },
error:
function(){ }
});

情景3:没有form对象,利用formData,动态添加数据并提交

    function UpladFile(fileUploadId, taskid) { 
     var fileObj = document.getElementById(fileUploadId).files[0]; // 获取文件对象
// FormData 对象
var form_data = new FormData();
//form.append("author", "hooyes"); // 可以增加表单数据
form_data.append("taskid", taskid);
form_data.append("file", fileObj); // 文件对象
      $.ajax({
     type: "POST",
      dataType: "html",
      url: www.baidu.com,
      data: form_data,
      success: function (data) {      },
      error: function(data) {      }
      });
  }

js表单动态添加数据并提交的更多相关文章

  1. jQuery实现表单动态添加与删除数据操作示例

    <!DOCTYPE html> <html lang="en"> <head>   <meta charset="UTF-8&q ...

  2. 表单动态增加div元素提交方法

    实现的效果如下: 1 var detail_div = 1; 2 var i=0; 3 function add_div() { 4 var e = document.getElementById(& ...

  3. js表单提交,面向对象

    一.js表单验证之后再提交 1.普通按钮onclick函数调用表单的submit()函数 <input type=button name="submit1" value=&q ...

  4. js表单提交,判断文本框,用户名密码是否为空,JS表单检测!

    当表单提交时先触发验证的js代码,当验证表单的方法返回true时才会提交表单返回false则不提交数据<script type="text/javascript">fu ...

  5. Jquery实现表单动态加减、ajax表单提交

    一直在搞Java后台开发,记得刚工作那一两年时间搞过前后端交互开发,用的东西也是五花八门,当时觉得做页面展示给别人看,是很有成就的事情,不过现在感觉自己跟纯前端开发比起来弱爆了,不过如果你的目标是作为 ...

  6. 循序渐进VUE+Element 前端应用开发(27)--- 数据表的动态表单设计和数据存储

    在我们一些系统里面,有时候会需要一些让用户自定义的数据信息,一般这些可以使用扩展JSON进行存储,不过每个业务表的显示项目可能不一样,因此需要根据不同的表单进行设计,然后进行对应的数据存储.本篇随笔结 ...

  7. php实现点击文字提交表单并传递数据至下一个页面

    <?php $id="4";//等会要把这个数据传到第二个页面 ?> <?php echo "<li>"; echo " ...

  8. jquery.validation.js 表单验证

    jquery.validation.js 表单验证   官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuer ...

  9. Jquery.validate.js表单验证插件的使用

    作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...

随机推荐

  1. js排序算法总结—冒泡,快速,选择,插入,希尔,归并

    相信排序是任何一个程序猿都会用到的东西,今天简单总结记录下常见的排序算法. 一.冒泡排序 说起冒泡排序,可能每个人都不会陌生,实现思路相当简单明了,就是不停的对数组进行两两比较,将较大(较小)的一项放 ...

  2. img只显示图片一部分 或 css设置背景图片只显示图片指定区域

    17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...

  3. swift-Array(数组)

    Swift 数组用于存储相同类型的值的顺序列表.Swift 要严格检查,不允许不同类型的值在同一个数组中 声明一个数组 var someArray = [SomeType]() var someArr ...

  4. 印象笔记 剪藏(Evernote WebClipper) bug 记录

    问题记录: Chrome版的 webclipper不知为何新装的时候切换到中国版印象笔记登陆的时候闪退,然后之后就无法进入中国区的登录页面:international版确认可以登录. cookies是 ...

  5. Jenkins 集成打包和上传 App Store 的冲突

    周一下午用 Jenkins 集成打包,遇到了一个很奇怪的问题,之前上传到 APP Store 的时候 Build Settings->“Code Signing Resource Rules P ...

  6. poj3629

    //(队列)poj3629 /* #include <iostream> #include <queue> #include <algorithm> using n ...

  7. Apache error: 403 Forbidden You don't have permission to access

    CentOS 6 solution: chcon -t httpd_sys_content_t -R /directory refer to: https://www.centos.org/forum ...

  8. jQuery图片滚动插件

    //该组件目前仅适用于一次移动一张图片的情况 (function ($) { $.fn.extend({ "scroll": function (options) { option ...

  9. CentOS7 编译安装LVS 互为主备 (实测 笔记 Centos 7.0 + ipvsadm 1.27 + keepalived 1.2.15 )

    环境: 系统硬件:vmware vsphere (CPU:2*4核,内存2G,双网卡) LVS服务器(两台): 系统:Centos7.0 64位(LVS+keepalived) LvsMaster:1 ...

  10. java执行linux命令

    package com.gtstar.collector; import java.io.BufferedReader;import java.io.IOException;import java.i ...