javascript - 使用 jQuery ajax POST 接收多个数据

Question

我正在使用 ajax 获取数据并填充一个选择框。在下面的代码中，我回显了 ajax.php 文件的输出，并接收了它。一切正常。但是，如您所见，所有 html 都填充在一个选择框中。我想返回两个独立选择框的数据，而不是一个。

因此我的问题是，如何从 ajax.php 中分别发送两种不同类型的数据，以及如何在成功函数中接收它。

$.ajax({
    type: "POST",
    url: "../ajax.php",
    data: {name: 'select1', id: id},
    cache: false,
    success: function(html){                
        $(".select1").html(html);
    }           
});

Ajax.php 只回显数据:

//data for select1
foreach($rows as $row){ 
    echo '<option>x</option>';      
}

//I want to add another one for select2
foreach($rows1 as $row){    
    echo '<option>y</option>';      
}       
die();

并希望收到类似的东西:

success: function(html){                
    $(".select1").html(data1);
    $(".select2").html(data2);
}

编辑:我正在使用 ajax 获取数据，因为我正在使用依赖选择框并从数据库中获取数据。因此，通过单击选择 1，它会从数据库中获取选择 2 的数据，这就是我这样做的原因。

Answer 1

你可以在你的 Ajax.php 中做这样的事情

//select1
$data['html1'] = NULL;
foreach($rows as $row){ 
    $data['html1'] .= '<option>x</option>';      
}
//select2
$data['html2'] = NULL;
foreach($rows1 as $row){    
   $data['html1'] .= '<option>y</option>';      
}  
$resonse = json_encode($data);
echo $response;
//JQUERY MAKE SURE THAT ITS OF TYPE JSON.
success: function(response){                
    $(".select1").html(response.html1);
    $(".select2").html(response.html2);
}