Ajax調用崩潰頁面

Question

我想創建一個帶有Ajax的評論系統。系統對post_comment.php進行ajax調用，在那裏執行INSERT INTO並返回我需要的信息。

問題：腳本似乎不工作..它只是凍結我的頁面，如果我等待它刷新頁面8秒後。

<script type="text/javascript"> 
function post() 
{ 
    var comment = document.getElementById("content").value; 
    if(comment) 
    { 
    $.ajax 
    ({ 
     type: 'post', 
     url: 'templates/post_comment.php', 
     data: 
     { 
     content:content, 
     user_id:<?php echo $_SESSION['id']; ?>, 
     brand_id:<?php echo $_SESSION['brand_id']; ?>, 
     ticket_id:<?php echo $_GET['unique_id']; ?> 
     }, 
     success: function (response) 
     { 
      console.log('okay response'); 
     document.getElementById("all_comments").innerHTML=response+document.getElementById("all_comments").innerHTML; 
     document.getElementById("content").value=""; 
     document.getElementById("username").value=""; 

     }, error: function() { 
      alert("There was an error. Try again please!"); 
     } 
    }); 
    } 

    return false; 
} 
</script> 

（從谷歌控制檯）唯一的錯誤我看到的是如下：最大調用堆棧大小超過了jQuery的 它在刷新過程中出現，然後消失

任何想法？提前致謝！

Answer 1

你的問題是在這條線：

content:content, 

更改該行：

content: comment, 

請更改線路，因爲內容是一個對象，你不能添加內的另一個對象目的。在鉻最後的版本這個對象是輸入內容本身，而在Mozilla它是指窗口對象。

我從MDN報告此：

content：不贊成 此功能已經從Web標準中刪除。儘管一些瀏覽器可能仍然支持它，但它正在被丟棄。避免使用它並儘可能更新現有的代碼;請參閱本頁底部的兼容性表格來指導您的決定。請注意，此功能可能隨時停止工作。

我確定你想參考評論變量。

function post(e) { 
 
    e.preventDefault(); 
 
    var comment = document.getElementById("content").value; 
 
    // 
 
    // the next line in order to show the type of content 
 
    // 
 
    console.log('content is : ' + typeof(content)); 
 
    if (comment) { 
 
     $.ajax({ 
 
      type: 'GET', 
 
      url: 'https://api.github.com/repositories', 
 
      data: { 
 
       since: '384', 
 
       // 
 
       // changed from content to comment 
 
       // 
 
       content: comment, 
 
       user_id: 'id', 
 
       brand_id: 'brand_id', 
 
       ticket_id: 'unique_id' 
 
      }, 
 
      dataType: "json", 
 
      success: function (response) { 
 
       console.log('okay response'); 
 
       document.getElementById("all_comments").innerHTML = response + document.getElementById("all_comments").innerHTML; 
 
       document.getElementById("content").value = ""; 
 
       document.getElementById("username").value = ""; 
 

 
      }, 
 
      error: function() { 
 
       alert("There was an error. Try again please!"); 
 
      } 
 
     }); 
 
    } 
 
    return false; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<form> 
 
    content: <input type="text" id="content" value="content"> 
 
    all_comments: <input type="text" id="all_comments" value="all_comments"> 
 
    username: <input type="text" id="username" value="username"> 
 
    <input type="submit" value="Submit" id="submit" onclick="post(event);"> 
 
</form>