Question

我正在研究一个项目，并且已经发布了关于ajax的帖子，但我不想改变帖子的主题，所以我认为制作一个新帖子是最好的。我相信我的ajax电话不起作用。我为什么这么认为？当我将fil直接插入我的表单（action =“X”）时，它的工作方式......有点，但这是另一个故事。但是当我将它插入我的ajax时，它不会向我的JSON发送任何内容。

我的ajax（我使用了上一篇文章中的那篇）;

 function saveExercise() {
     // more not related code
 }

 $('.eBlock').each(function (i, contents) {
  //some code thats inside this function but not related
 });

$('#my_form').submit(function(event) {
      event.preventDefault();
      $.ajax({
         url: 'writeJson.php',
         type: 'POST',
         data: eBlock,
         dataType: 'json',
         succes: function(result) {

         }
      })
 });

我的HTML;

<form  id='my_form' class="container-fluid" action="" method="POST" required>
     <button id='resetInputs' type='button' onclick='getResetInputs()' class='btn btn-danger fa fa-refresh fa-2x resetInputs'></button>
     <button type='submit' id='saveBtn' class='btn btn-info fa fa-download fa-2x saveBtn' required name="submit"></button>
</form>

我一直在四处寻找：Form not submitting with AJAX

https://wordpress.stackexchange.com/questions/189241/cant-trigger-an-ajax-function-with-a-submit-button-in-the-dashboard

与eBlock相关的每一段代码，我称之为函数，目的是什么，它做什么。对于困惑和迟到的反应，我感到很抱歉。

$(document).ready(function() {
  var id = 0;
  var addOpdracht = $('<a/>', {
 'class': 'btn btn-success',
 'id': 'addOpdracht'
}).on('click', function() {
 $('form').append(getExerciseBlock(id));
});


function getExerciseBlock(i){
  var eBlock = $('<div/>',{
 'id': i,
 'class': 'col-md-12 eBlock'
});

 $(eBlock).append(getRemoveBtnExercise(i), getAudioBtn(i), getWordInput(i), 
  getWordPartInput(i), getWordPartInput(i), getRemoveBtn(i), 
 getAddBtn(eBlock, i));

  return eBlock;
}

Answer 1

让我们看看代码：

$('#my_form').submit(function(event) {
      event.preventDefault();
      $.ajax({
         url: 'writeJson.php',
         type: 'POST',
         data: eBlock,
         dataType: 'json',
         succes: function(result) {

         }
      })
 });

问题：

你正在使用成功而不是成功，这将永远不会被执行
自jQuery 1.5以来已弃用成功，您将需要使用done
eBlock是一个变量，我们看不到它的初始化。从名称来看，很有可能eBlock是一个jquery对象，你需要传递一个简单的对象或一个查询字符串

修复

$('#my_form').submit(function(event) {
      event.preventDefault();
      $.ajax({
         url: 'writeJson.php',
         type: 'POST',
         data: {},
         dataType: 'json',
      }).done(response) {
          console.log(response);
      }
 });

改进

让我们挖掘名称中的所有项目：

$('#my_form').submit(function(event) {
      event.preventDefault();
      var data = {};
      var items = $(this).find("[name]");
      for (var i = 0; i < items.length; i++) {
          var v = items[index].value;
          if (items[index].tagName.toLowerCase() === "input") {
              if (items[index].type === "checkbox") {
                  v = items[index].checked;
              }
          }
          data.push(items[index].name + "=" + v);          
      }
      $.ajax({
         url: 'writeJson.php',
         type: 'POST',
         data: data,
         dataType: 'json',
      }).done(response) {
          console.log(response);
      }
 });

Ajax不提交我的表单，但会通过操作提交

1 个答案:

修复

改进