Ajax 不返回数据

Question

嘿，在这种情况下，我正在尝试退回以某个字母开头的书籍 H。但是我根本无法使此代码正常工作，任何帮助都会非常充分。 HTML

<a href="" id="searchH" name="h" value="h"> <<<< CLICKED

<div id="ack2"></div> <<<<<< DISPLAYED HERE

PHP

<?php
include('db.php');
$letter = "";
$i = 0;
$jsonData = '{"books":[';
if(isset($_POST['letter'])){
    $letter = $_POST['letter'];

    $sqlString = "SELECT * FROM book WHERE title LIKE '$letter%'";

    $query = mysql_query($sqlString) or die (mysql_error()); 
    while ($row = mysql_fetch_array($query)) {
        $i++;   
        $year = $row["year"];   
        $title = $row["title"];
        $author = $row["author"]; 
        $jsonData .= '{ "title":"'.$title.'", "author":"'.$author.'", "year":"'.$year.'" },';
    }

    $jsonData =  chop($jsonData, ",");
    $jsonData .= ']}';
    echo $jsonData;
}
?>

Ajax/javaScript

$("#searchH").click(function(){
    letter = $("#searchH").val();
    $.ajax({
        type: "POST",
        url: "azlistscript.php",
        data: "letter ="+letter,
        success: function(html){
            $("#ack2").html(html);
            }
            });
    });

如果我手动更改字母值，PHP 文件会返回书籍数据，它会显示以 H 开头的书籍，只需将其显示在我的 html 页面上的 div 标签中。

点击事件的值在控制台中没有记录任何值

Answer 1

我能看到的一个问题是

letter = $("#searchH").val();

元素是'a'标签，它不是表单元素，所以 .val() 在这里不起作用。而是尝试

letter = $("#searchH").attr('value');

Answer 2

检查您的 javascript 中的数据，尝试：

 //JavasCript code
 $("#searchH").click(function(){
   $.ajax({
      type: "POST",
      url: "azlistscript.php",
      data: { letter:  $("#searchH").val()},
      success: function(html){
          $("#ack2").html(html);
          }
        });
  });

---

在 PHP 中检查你的 POST 数组：

 <?php
 // PHP code
  if(isset($_POST['letter'])){
    // your more code...
  }else { //debug POST array
      echo '<pre>'. print_r($_POST['letter'], true) . '</pre>'
  }

Answer 3

您需要解决一些问题：

$("#searchH").click(function (e) {
    e.preventDefault(); //prevent browser link behaviour
    var letter = $(this).attr("value"); //get the attribute (ex: value, name, etc.)
               //^^^^^^^this refers to the current element being clicked
    $.ajax({
        type: "POST",
        url: "azlistscript.php",
        data: "letter =" + letter,
        success: function (html) {
            $("#ack2").html(html);
        }
    });
});

Answer 4

success: function(html)
{
});

html 只是您为返回的对象提供的名称。该对象包含一些变量，包括消息 d。

你必须去拿它：

success: function(html)
{
    var message = html.d;
    // use message
});

我不知道为什么它是 d，但这就是 cookie 崩溃的方式。

如果它不能完成工作，那么您提供的数据或后端处理事情的方式有问题，只需使用开发人员工具并检查网络中发生的情况。如果您是空白的，您可以随时记录正在发生的事情。

编辑： d 部分可能只是 ASP 提供的 [WebMethod] 返回方法的一部分。 See discussion。那么更多的主题：

• 确保您已检查您发送的值。
• 确保您已检查收到的值。
• 确保您已经检查了请求响应提供的 http 网络状态（实际上是 200 吗？）。

如果那里有什么奇怪的地方，那么你就会更加了解正在发生的事情。

Answer 5

像这样生成你的 php 输出 json_encode(array("title"=>$title,"author"=>$author,"year"=>$year));

在你的 js 中使用 output = $.parseJSON(html) 解析输出，然后使用显示它

$("#ack2").html('<span>'+output.title+'</span>'+'<span>'+output.author+'</span>'+'<span>'+output.year+'</span>');

Answer 6

你有一个好的开始，但你缺少一些东西：

1. 不要相信来自不可信来源的输入数据。将来自 $_REQUEST、$_GET、$_POST 的数据视为来自恶意黑客。这就是为什么你应该过滤数据。您的代码目前对 SQL 注入攻击开放，就像其他人提到的那样。如果您使用输入数据进行 SQL 插入，您也会对 XSS 开放。

2. 始终仔细检查您的 HTML 以检查您是否正确编写它，您是否了解标签及其属性的使用。这意味着它遵守 W3C 标准。您可以通过http://validator.w3.org 运行您的HTML。您将要阅读来自http://www.w3.org/TR/html5/ 的文档。谷歌w3c html5 a tag 更容易，只需替换您感兴趣的标签。value 属性在锚标签上不存在。如果要为其附加值，请改用 HTML5 数据属性。看看我修改过的代码。

3. 确保您了解 jQuery API 和参数：http://api.jquery.com 和 http://learn.jquery.com。例如，成功函数的第一个参数会根据从服务器返回的数据类型（xml、json、html）而变化。它可能是一个字符串，也可能是一个真正的 javascript 对象，这是 JSON 没有出现在 div 中的原因之一。

4. 在您的 AJAX data 选项中，您在键名（即字母）之后放置了一个额外的空格。这意味着它最终会出现在您的 PHP 中，因此您的 if 语句将失败。小心这样的小错别字。他们确实有所作为。

5. mysql_* 函数现在在 PHP 5.5 中已弃用，这意味着您的代码最终将无法在 PHP 的未来版本中运行。请记住这一点并使用mysqli_* 函数代替或更好地使用mysqli 类并编写您的代码面向对象样式。

6. 就像其他人提到的那样，请改用json_encode。为什么？您不必担心让 JSON 语法正确，尤其是当您想要更改 JSON 响应的外观时。使用json_encode，您需要做的就是给它一个数组。如果您更改数组的形状，JSON 将始终以您想要的方式出现。太容易了。

这是实时代码：

Javascript 和 HTML：http://jsbin.com/nutaquzu/2/edit

PHP：http://codepad.viper-7.com/zak79I

欢迎来到网络开发的世界！