jQuery的serializeArray()方法的使用---通过序列化表单值来创建对象（name 和 value）的数组

js

 let $form = $('.propagandaTemplatesForm'),
      formData = $form.serializeArray(),
      //serializeArray() 方法通过序列化表单值来创建对象（name 和 value）的数组。
      data = new FormData();
      //用一些键值对来模拟一系列表单控件：即把form中所有表单元素的name与value组装成
    for (let i in obj) {
      data.append(i, obj[i]);
    }
    for (let i in formData && formData[i].name != 'hdms') {
      if (formData[i].value == '') {
        let message = '请输入' + $form.find('input[name="' + formData[i].name + '"]').prev().text().slice(0, -1);
        //如果为空就弹出相对应得提示
        func.rbdToast({
          text: message,
          icon: 'error',
        });
        return false;
      }
      if(formData[i].name != 'hdms'){
        data.append(formData[i].name, formData[i].value.trim());
      }
        data.append('hdms', tinymce.activeEditor.getContent());
      //获取name,value
    }

js

    tinymce.init({
      selector: '#hdms', //容器，可使用css选择器
      language: 'zh_CN', //调用放在langs文件夹内的语言包
      toolbar: true, //工具栏
      menubar: true, //菜单栏
      branding: false, //右下角技术支持
      inline: false, //开启内联模式
      elementpath: false,
      fontsize_formats: '8pt 10pt 12pt 13pt 14pt 15pt 16pt 17pt 18pt 19pt 20pt 24pt 36pt',
      font_formats: "微软雅黑='微软雅黑';宋体='宋体';黑体='黑体';仿宋='仿宋';楷体='楷体';隶书='隶书';幼圆='幼圆';Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Trebuchet MS=trebuchet ms,geneva;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings",
      min_height: 400, //最小高度
      height: 450, //高度
      max_height: 600,
      skin: 'oxide',
      toolbar_sticky: true,
      visualchars_default_state: true, //显示不可见字符
      image_caption: true,
      paste_data_images: true,
      relative_urls: false,
      // remove_script_host : false,
      removed_menuitems: 'newdocument', //清除“文件”菜单
      plugins: 'lists,hr, advlist,anchor,autolink,autoresize,charmap,code,codesample,emoticons,fullscreen,image,media,insertdatetime,link,pagebreak,paste,preview,print,searchreplace,table,textcolor,toc,visualchars,wordcount', //依赖lists插件
      toolbar: 'fontselect fontsizeselect bullist numlist anchor charmap emoticons fullscreen hr image insertdatetime link media pagebreak paste preview print searchreplace textcolor wordcount',
      //选中时出现的快捷工具，与插件有依赖关系
      // images_upload_url: urls.save_file,
      images_upload_handler: function (blobInfo, succFun, failFun) {
        var xhr, formData;
        var file = blobInfo.blob(); //转化为易于理解的file对象
        xhr = new XMLHttpRequest();
        xhr.withCredentials = false;
        xhr.open('POST', urls.save_file);
        xhr.onload = function () {
          func.rbdLoading();
          var json;
          if (xhr.status != 200) {
            failFun('HTTP Error: ' + xhr.status);
            return;
          }
          json = JSON.parse(xhr.responseText);
          if (!json || typeof json.location != 'string') {
            failFun('Invalid JSON: ' + xhr.responseText);
            return;
          }
          $('.loading.rbd-load').remove();
          succFun(json.location, {
            alt: file.name
          });
        };
        formData = new FormData();
        formData.append('csrfmiddlewaretoken', csrfmiddlewaretoken);
        formData.append('file', file, file.name); //此处与源文档不一样
        xhr.send(formData);
      },
      /*后图片上传接口*/
      /*返回值为json类型 {'location':'uploads/jpg'}*/
      setup: function (hdms) {
        hdms.on('change', function () {
          hdms.save();
        });
      },
      file_picker_callback: function (callback, value, meta) {
        //文件分类
        var filetype =
          '.pdf, .txt, .zip, .rar, .7z, .doc, .docx, .xls, .xlsx, .ppt, .pptx, .mp3, .mp4';
        //后端接收上传文件的地址
        var upurl = urls.save_file;
        //为不同插件指定文件类型及后端地址
        switch (meta.filetype) {
          case 'image':
            filetype = '.jpg, .jpeg, .png, .gif';
            break;
          case 'media':
            filetype = '.mp3, .mp4';
            break;
          case 'file':
          default:
        }
        //模拟出一个input用于添加本地文件
        var input = document.createElement('input');
        input.setAttribute('type', 'file');
        input.setAttribute('accept', filetype);
        input.click();
        input.onchange = function () {
          func.rbdLoading();
          var file = this.files[0];
          var xhr, formData;
          xhr = new XMLHttpRequest();
          xhr.withCredentials = false;
          xhr.open('POST', upurl);
          xhr.onload = function () {
            var json;
            if (xhr.status != 200) {
              func.rbdToast({
                text: 'HTTP Error: ' + xhr.status,
                icon: 'error',
              });
              return;
            }
            json = JSON.parse(xhr.responseText);
            if (!json || typeof json.location != 'string') {
              func.rbdToast({
                text: 'Invalid JSON: ' + xhr.responseText,
                icon: 'error',
              });
              return;
            }
            $('.loading.rbd-load').remove();
            callback(json.location, {
              alt: file.name
            });
          };
          formData = new FormData();
          formData.append('csrfmiddlewaretoken', csrfmiddlewaretoken);
          formData.append('file', file, file.name);
          xhr.send(formData);
        };
      },
      init_instance_callback: myCustomInitInstance,
    });

	  function myCustomInitInstance() {
    let content = $('.data_content').text();
    if (content) {
      var txt = func.htmlDecode(content);
      tinymce.activeEditor.setContent(txt);
    }
  }

formData得例子

html

<form onsubmit="return false" class="propagandaTemplatesForm">
	<p>
     <span>姓名：</span><input type="text" value="zs" name="xm">
   </p>
   	<p>
     <span>年龄：</span><input type="text" value="25" name="nl">
   </p>
    <p>
     <span>成绩：</span><input type="text" value="95" name="cj">
   </p>
   <p>
   	<span>内容：</span><div class="data_content" style="display: none">{{ hdms |mark_safe }}</div>
   					<div id="hdms"  style="float:left;width: calc(100% - 138px);height: 500px;"></div>
   </p>
</form>