Question

我正在尝试使用以下代码，以便在单击以下链接时显示来自我的数据库的数据:(不刷新页面）

<a id="bugatti_link" href="#" database_id="Bugatti">Bugatti</a>

不幸的是它没有用，它没有显示任何内容而且没有出错。

index.php =

<a id="bugatti_link" href="#" database_id="Bugatti">Bugatti</a>

<script>
$("#bugatti_link").click(load_ajax);

function load_ajax(e) {
    var link = $(e.target); 
    var vehicle_database_id = link.attr("database_id");
    var ajax_params = {"brand": vehicle_database_id};
    $.getJSON("query2.php", ajax_params, success_handler)
}

function success_handler(data) {
    //data variable contains whatever data the server returned from the database.
    //Do some manipulation of the html document here. No page refresh will happen.
}
</script>

query2.php =

<?php
$host = "xx";
$user = "xx";
$db   = "xx";
$pass = "xx";

$pdo = new PDO("mysql:host=" . $host . ";dbname=" . $db, $user, $pass);

$rows = array();
if(isset($_GET['brand'])) {
    $stmt = $pdo->prepare("SELECT brand FROM cars WHERE brand = ? ");
    $stmt->execute(array($_GET['brand']));
    $rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
}
echo json_encode($rows);
?>

Answer 1

您将json数据传递给'success_handler'，但数据未在该函数中处理

Answer 2

请注意在$ .getJSON代码中添加.error。如果请求失败，这将告诉您原因。收到了回复，但可能会有问题，这会告诉您。请参阅下面的注释，了解为什么它可能会无声地失败。

此外，在代码周围添加$（document）.ready包装是最好的，因为它确保页面在运行javascript之前已完全加载。根据浏览器以及元素的嵌套方式，它可能已准备好也可能未准备好附加事件。无论如何，最好把它放在文件中，随时可以确定。

$(document).ready( function(){
    $("#bugatti_link").click(function(e){
        e.preventDefault();
        var vehicle_database_id = $(this).attr("database_id");
        var ajax_params = {"brand": vehicle_database_id};
        $.getJSON("query2.php", ajax_params, function(data){
            //data variable contains whatever data the server returned from the database.
            //Do some manipulation of the html document here. No page refresh will happen.
        })
        .error(function(data,msg,error){
            alert( msg );
        });
    });
})

重要提示：从jQuery 1.4开始，如果JSON文件包含语法错误，请求通常会无声地失败。避免经常手工编辑因此JSON数据。 JSON是一种数据交换格式语法规则比JavaScript的对象更严格字面符号。例如，所有以JSON表示的字符串，无论是属性还是价值，都必须附上双引号。有关JSON格式的详细信息，请参阅http://json.org/。

无需刷新即可显示数据库中的数据（Javascript）

2 个答案: