Ajax - jQuery 和 Ajax 错误/不工作

Question

我正在构建一个网页，其中包含一个div ，其中包含通过 PHP 从 MySql 数据库中检索到的一些数据。 这个 div 显示了一些产品，在它的左边有一个带有不同类别的简单导航栏。 我试图做的是，当用户单击此导航栏的某个类别时， div的内容将发生变化，显示该类别的所有产品都存储在 db 中。 所以我尝试使用 Ajax（顺便说一句，我的第一次），但我似乎无法让它工作。 我的项目结构是这样的：

父目录

• php > index.php
• css > index.css
• js > index.js
• img > 图片在这里
• ajax> 产品-ajax.js / 产品-ajax.php

index.php 文件链接到 index.js 和 products-ajax.js 但是，我已经尝试在 index.js 和 index.php 中包含 Ajax 代码行，但我无法让它从products-ajax.php 任何帮助表示赞赏。

这是我的测试代码的样子：

 /* THIS IS THE products-ajax.js */ $(document).ready(function(){ $('.products-list li').click(function(){ $.post("products-ajax.php", {p: "Product name"}, success: function(data){alert(data)} ); }); });

 <?php /* THIS IS THE products-ajax.php */ $p = $_POST['p']; echo $p; ?>

我意识到我的浏览器的调试器说缺少括号：

$('.products-list li').click(function(){
 //The debugger says HERE v should go a parentheses
$.post("products-ajax.php", {p: "Product name"}, success: function(data{alert(data)});

});

Answer 1

使用$.ajax()而不是$.post() ，您可以添加一个错误处理程序，它会给您提供宝贵的信息（也许您可以使用$.post() ，但我不熟悉这个函数，afaik 是只是$.ajax()的快捷方式）。 它可能是这样的：

var request = $.ajax({
    url: "products-ajax.php",
    method: "POST",
    data: { p: "Product name" }
});
request.done(function( data ) {
    alert( data );
});
request.fail(function( jqXHR, textStatus ) {
    alert( "Request failed: " + textStatus );
});

编辑：并且更喜欢console.log()而不是alert()进行调试。 特别是对于异步交互， alert()有时会导致意外......