Question

下面是我的html表单

<form id='add'>
<input type="text" name="title">
<textarea id="usingckeditor" name="content"></textarea>
<input type="file" name="file">
<button id="save">save</button>
</form>

这是我的javascript

$("#save").on('submit',(function(e) {
 $.ajax({
    url: "blog/saveblog.php",
    type: "POST",
    data:  new FormData(this),
    contentType: false,
    cache: false,
    processData:false,
    success: function(data){

    }
});
})

我使用新的FormData（）将数据发送到saveblog.php，并使用saveblog.php上传图片并获取$ _POST [＆＃39; title＆＃39;]的值，但$ _POST [ ＆＃39;内容＆＃39;]为空

FormData如何获取textarea的内容（使用ckeditor）？

Answer 1

按钮没有提交事件，您必须将提交事件绑定到表单，您还必须阻止表单提交，因为您使用ajax发布数据。
CKEditor管理自己的内容，因此它不在textarea中，您可以通过在CKEditor实例上调用getData()来获取它

<form id='add'>
  <input type="text" name="title">
  <textarea id="usingckeditor"></textarea>
  <!-- remove name attribute so it will not pollute form data object -->
  <input type="file" name="file">
  <button id="save">save</button>
</form>

$("#add").on('submit',(function(e) {// attach form to submit event
  e.preventDefault(); //prevent the form from submitting
  var data = new FormData(this);
  //add the content
  data.append('content', CKEDITOR.instances['usingckeditor'].getData());
  $.ajax({
    url: "blog/saveblog.php",
    type: "POST",
    data:  data,
    contentType: false,
    cache: false,
    processData:false,
    success: function(data){

    }
  });
})

Answer 2

您可以使用：

$(form).trigger('form-pre-serialize');

然后创建新的FormData()

Answer 3

在ajax调用之前添加它：

var data = new FormData([form]);
data.append('[textarea_name]', CKEDITOR.instances['textarea_id'].getData());

使用FormData对象获取CKeditor值

3 个答案: