Question

我正在创建一个包含三个主要字段和几个附加字段的表单。其中一个主要字段是选择类型，还会选择一些其他字段。所有选择字段的值来自连接到数据库的包含的.php文件。我的目标是使附加字段仅显示与主选择字段的选择相关的值。我看到它的方式是onClick主要选择我将调用带有ajax的javascript函数，它会将新值发送到同一页面并刷新主div的内容（包含所有包含php的文件，这将占用新参数并显示所需的值）

body
  div id=container
   div id=menu
   div id=main

我对ajax的了解是如何将变量发送到不同的php页面并获得回显的响应。有人可以解释如何在刷新特定div时在同一页面上发送/更改php变量的值。（或者可能有人知道我的问题的更好的解决方案）。谢谢你的时间！

Answer 1

假设你的主选择是这样的：

<select id="main_select">
    <option value="car">Cars</option>
    <!-- other options -->
</select>

你有一个容器，它应该根据所选的选项显示细节

<div id="details">
    <!-- the details options will be added here -->
</div>

您有一个PHP文件，它根据所选选项

回显详细信息

<?php
$mainOption = $_POST['option'];
details($mainOption);

function details($opt)
{
    if($opt == 'car')
        echo '<select class="detail_select">
                <option value="bmw">BMW</option>
                <option value="ferrari">Ferrari</option>
                <option value="porsche">Porsche</option>
            </select>';
    else if($opt == 'another_option')
    {
        echo 'other details';
    }
}
?>

你的Ajax可能是这样的：

$(document).ready(function () {
    $('#main_select').change(function(){
        $.ajax({
            url: "something.php",
            type: "post",
            data: {option: $(this).find("option:selected").val()},
            success: function(data){
                //adds the echoed response to our container
                $("#details").html(data);
            }
        });
    });
});

在<select> </select>的更改上刷新php内容

1 个答案: