更好的方法来显示两个PHP变量切换jQuery Ajax

Better approach for displaying two PHP variable switch jQuery Ajax

本文关键字:变量 PHP 两个 Ajax jQuery 方法 显示 更好      更新时间:2023-09-26

我从一个表中得到两个随机值。值在同一行

<?php
    $result = mysql_query("SELECT * FROM people ORDER BY RAND() LIMIT 1", $connection);
    $row = mysql_fetch_array($result);
    echo $row["name"];
    echo $row["surname"];
?>

我想用jQuery Ajax函数在我的HTML页面的不同div上显示这两个值。

$(function()
{
    $("#sentence-form").submit(function()
    {
        $.ajax(
        {
            type: "GET",
            url: "newperson.php",
            success: function(response)
            {
                $("#top-container").append(response);  /* Both name and surname  */
            }
        });
    });
});

问题是分隔两个值以在div中显示不同的值。我尝试使用两个Ajax调用,并将布尔数据发送到PHP以使用if语句。其中一个Ajax调用显示姓名,另一个显示姓氏。但是由于随机化,找到一个名字的姓氏有点复杂。

什么是更好的方法?

是:以数据结构发送数据-可能是JSON -这样您的客户端代码就知道哪个位是哪个。

首先,使用PHP的json_encode函数发送数据:
echo json_encode(array(
    'name' => $row['name'],
    'surname' => $row['surname']
));

然后使用浏览器解析JSON的能力:

$.ajax({
    type: "GET",
    url: "newperson.php",
    dataType: 'json',
    success: function (response) {
        $("#name-container").append(response.name);
        $("#surname-container").append(response.surname);
    }
});

response现在是一个Javascript对象(类似于{name: 'John', surname: 'Smith'}),因此您可以作为普通对象成员访问这两个部分。

以JSON数组的形式发送变量

<?php
    $result = mysql_query("SELECT * FROM people ORDER BY RAND() LIMIT 1", $connection);
    $row = mysql_fetch_array($result);
    $output['name'] = $row["name"];
    $output['surname'] = $row["surname"];
    echo json_encode($output);
?>

在JavaScript代码中,访问它为:

data.namedata.surname

虽然我喜欢lonessomeday的答案,而且我认为这是一种方式,但我将发布替代方案:

有关PHP:

echo $row["name"].'||'.$row["surname"];
相关JavaScript代码:
success: function (response) {
    var parts = response.split('||');
    $("#name-container").append(parts[0]); //name
    $("#surname-container").append(parts[1]); //surname
}

使用

<?php
    $result = mysql_query("SELECT * FROM people ORDER BY RAND() LIMIT 1", $connection);
    $row = mysql_fetch_array($result);
    echo $row["name"]."&".$row["surname"];
?>
$(function(){
  $("#sentence-form").submit(function(){
    $.ajax({
      type : "GET",
      url : "newperson.php",
      success : function(response){
        items=response.split('&')
          $("#top-container").append(items[0]);  /* name  */
          $('#bottom-container").append(items[1]); / /*s(u should be i)rname */
        }
      });
   });
});