javascript - 为什么AJAX函数不立即从数据库获取数据？

Question

我有 2 个 AJAX 脚本:

第一个使 HTML-table 的第一个单元格可编辑，并将输入的值直接写入 DB-table；

2nd 从 DB 表和 HTML 表的第二个单元格中的鞋子中获取数据。

顺序是这样的:

1. 用户单击第一个 HTML 表格的单元格，对其进行编辑。 AJAX 脚本将其写入数据库。

2. PHP 脚本将此数据添加到某个变量并将答案写入数据库。

3. AJAX 脚本立即从数据库和第二个 HTML 表单元格中的鞋子中获取数据。

脚本是这样的:1.编辑.js:

   function showEdit(editableObj) {
     $(editableObj).css("background","#FFF");
   } 

  function saveToDatabase(editableObj,column,id) {
    $(editableObj).css("background","#FFF url(loaderIcon.gif) no-repeat right");
  $.ajax({
    url: "days.php",
    type: "POST",
    data:'column='+column+'&editval='+editableObj.innerHTML+'&id='+id,
    success: function(data){
     $(editableObj).css("background","#FDFDFD");

      //$(editableObj).css("background","#FDFDFD");
     // $("#birthday-data").replaceWith(data); //The .replaceWith() method removes content from the DOM and inserts new content in its place with a single call
    }        
   });
}

<强>2。 Show.js:

$(document).ready(function() {           

  $.ajax({    // create an ajax request
    type: "POST",
    url: "days.php",             
    dataType: "text",   // expect html to be returned                
    success: function(response){                    
        $("#one").html(response); // get the element having id of "one" and put the response inside it
        //alert(response);

  }        

}

<强>3。表.php: //这是带有 HTML 表格的 PHP 脚本的内容部分

<td aria-label="First column" contenteditable="true" onBlur="saveToDatabase(this,'select1','<?php echo $show[$k]["id"]; ?>')" onClick="showEdit(this);"><?php echo $show[$k]["select1"]; ?></td>
      <td id="one"><?php echo $value['day1']; ?></td>

问题是我必须刷新页面才能看到我的 HTML-table 2 单元格已更新。期望它在编辑第一个单元格的数据后立即更新。认为问题出在show.php中，无法获取它。需要一些帮助!

Answer 1

function saveToDatabase(editableObj,column,id) {
    $(editableObj).css("background","#FFF url(loaderIcon.gif) no-repeat right");
  $.ajax({
    url: "days.php",
    type: "POST",
    data:'column='+column+'&editval='+editableObj.innerHTML+'&id='+id,
    success: function(data){
     $(editableObj).css("background","#FDFDFD");

      //$(editableObj).css("background","#FDFDFD");
     // $("#birthday-data").replaceWith(data); //The .replaceWith() method removes content from the DOM and inserts new content in its place with a single call

    $("#one").text(data);
    }        
   });
}

我相信您只是想从 days.php 获取响应以显示在表格单元格中...好吧，这就是您的做法。 'data' 是 days.php 的预期返回，因此 days.php 会回显您想要的任何内容 #one table cell 在 'column='+column+'&editval='+editableObj.innerHTML+'&id='+id 之后显示发送到该页面...然后它会将其直接放入单元格中。