Question

我正在开发一个使用php＆amp; amp; MySQL，我有两个功能 1.从数据库中获取数据， 2.显示HTML视图代码，其中包含使用$ _GET变量查看单个产品详细信息的链接。一切都很完美。但我希望在不刷新页面的情况下加载产品详细信息。我理解Ajax能够处理任务，但我对Ajax不了解。任何帮助将不胜感激。

以下是我的代码示例：

//Main product view
function product_view($product) {   
    $output = "";
    $output = $output . '<li class="col-sx-12 col-sm-3">';
    $output = $output . '<div class="product-container">';  
    $output = $output . '<a href="'. BASE_URL .'item/?id='. $productID .'&name='. str_replace(' ', '-', $product["name"]) .'"> product name</a>';
    $output = $output . '----';
    $output = $output . '----';
    $output = $output . '----';
    $output = $output . '</div>';
    $output = $output . '</li>';        
    return $output;
}

//Main product display
function get_products() {
    require(ROOT_PATH ."inc/db_connect.php"); 
    $sql = "SELECT * FROM products WHERE status='Active'";
    $query = mysqli_query($db_connect, $sql);                       
    return $query;  
}

//View page
$products = get_products();
if (!empty($products)) {
    foreach ($products as $product) {
        echo product_view($product);
    }
}

Answer 1

要按照问题的一些评论中的建议使用AJAX，您可以在客户端使用此示例代码：

$(document).ready(function(){

    $.ajax({
        url: 'products.php',
        method: 'GET'
    }).then(function(data){
        for(int i=0; i < data.length; i++){
            $('body').append('<li class="col-sx-12 col-sm-3"><div class="product-container>...'+data[i].attribute+'</div></li>');
            //append all information that you need
        }
    })

});

在你的后端，你需要返回JSON，所以：

$products = get_products();

header('Content-Type: application/json; charset=utf-8'); 
echo json_encode($products);

如何在不刷新页面的情况下显示产品详细信息

1 个答案: