切换到 JQuery 后从 PHP 到 JS 的响应不起作用

Question

所以，我正在开发自己的博客类型的网站，最近在尝试从我的代码中删除 JS 时遇到了一个问题。所以我有show.js 和showpost.php。这是我在使用 ajax js 时显示博客文章的 JS 代码：

  load: function () {
    posts.ajax({ req: "show" }, function () {
      document.getElementById("cwrap").innerHTML = this.response;
    });
  },

一切正常。但是当我尝试用 JQuery 版本替换它时

jQuery.ajax({
  type: "GET",
  url: 'app/showpost.php',
  dataType: 'text',

  success: function (data) {
    console.log(data);
    console.log("okokok");
    document.getElementById("cwrap").innerHTML = this.response;           
  }
});

它没有按预期工作！ 现在解释一下我的 showpost.php 文件是如何工作的：

<?php
include_once 'config.php';
echo('');
try {
    $stmt = $pdo->prepare("SELECT `name`, `likes`,`imagename`,`comment_id`, `timestamp`, `message` FROM `posts` WHERE `post_id`=? ORDER BY `timestamp` DESC");
   $stmt->execute([$_POST['pid']]);

  } catch (Exception $ex) {
    die($ex->getMessage());
  }

  while ($r = $stmt->fetch(PDO::FETCH_NAMED)) { 
?>
<div id="post" style="box-shadow: 0 .15rem 1.75rem 0 rgba(58,59,69,.15)!important;">
<button id="<?=$r['comment_id']?>" name="like" class="btn" style="  float: right;" action="likepost.php" method="post"><svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24" viewBox="0 0 24 24" width="24"><g><rect fill="none" height="24" width="24" y="0"/></g><g><g><path d="M13.12,2.06L7.58,7.6C7.21,7.97,7,8.48,7,9.01V19c0,1.1,0.9,2,2,2h9c0.8,0,1.52-0.48,1.84-1.21l3.26-7.61 C23.94,10.2,22.49,8,20.34,8h-5.65l0.95-4.58c0.1-0.5-0.05-1.01-0.41-1.37C14.64,1.47,13.7,1.47,13.12,2.06z M3,21 c1.1,0,2-0.9,2-2v-8c0-1.1-0.9-2-2-2s-2,0.9-2,2v8C1,20.1,1.9,21,3,21z"/></g></g></svg></button>
  <date><?=$r['timestamp']?></date>
  <h4>Bugs: <?=$r['likes']?></h4>
  <h3><?=$r['name']?></h3>
  <div class="message">
    <?=$r['message']?>
  </div>
  <img src="static/<?=$r['imagename']?>"> 
  </div>
 
  <?php }
  $stmt = null;
  $pdo = null;  
?>

如您所见，它是一个带有一点 html 的 Php 文件。当我使用 Xhr 时它运行良好，但现在使用 Jquery 它不起作用！请帮忙！

编辑：document.getElementById("cwrap").innerHTML = data; 没有改变任何东西，这可能是我的 showpost.php 没有发送 html 部分的问题。

Answer 1

问题出在您的success(data) 回调函数中。

  document.getElementById("cwrap").innerHTML = this.response;

你得到的是data，但你使用的是this.response，因为没有定义这样的变量，所以它是未定义的。 ajax 调用中的 dataType 也应该是 html，即dataType : 'html',。 所以应该是这样的：

jQuery.ajax({
  type: "GET",
  url: 'app/showpost.php',
  dataType: 'html',
  
  success: function (data) {
    console.log(data);
    console.log("okokok");
    document.getElementById("cwrap").innerHTML = data;           
  }
});

Answer 2

数据类型需要是html或者json

jQuery.ajax({
  type: "GET",
  url: 'app/showpost.php',
  dataType: 'HTML',

  success: function (data) {
    console.log(data);
    console.log("okokok");
    document.getElementById("cwrap").innerHTML = this.response;           
  }
});