Ajax未返回数据

Ajax not returning data

本文关键字：数据 返回 Ajax      更新时间：2023-09-26

嘿，在这种情况下，我正试图返回以某个字母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标记中。

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

我能看到的一个问题是

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

元素是"a"标记，它不是表单元素，因此.val((在这里不起作用。取而代之的是尝试

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

检查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>'
  }

您需要修复一些问题：

$("#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);
        }
    });
});

success: function(html)
{
});

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

你必须去拿：

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

我不知道为什么它是d，但饼干就是这样碎的。

如果它不起作用，那么你提供的数据或后端处理的方式就有问题，只需使用开发人员工具检查网络中发生了什么。如果你是空白的，你可以随时记录发生了什么。

EDIT:d部分可能只是ASP提供的[WebMethod]返回方法的一部分。请参阅讨论。更多主题然后：

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

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

生成如下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>');

你有一个良好的开端，但你错过了几件事：

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

  2. 一定要仔细检查HTML，检查它是否写得正确，是否理解标记及其属性的使用。这意味着它遵守W3C标准。您可以通过http://validator.w3.org.您将要从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总是会按照你想要的方式出现。Soooo要容易得多。

这是实时代码：

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

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

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

相关文章：