HTML/PHP 表单 - 更改时不刷新

Question

我有以下 HTML 表单和 PHP 查询，它们根据下拉选择显示数据库条目。一般来说，查询和表单都可以工作，但我想阻止整个网页刷新，但仍然显示数据。

我知道罪魁祸首是onchange="this.form.submit();" 但是，我无法让它与 jquery.1.8.3.min 一起使用。 jquery的目录/路径是src="js/jquery.1.8.3.min.js"

这是我的 HTML 表单和 PHP 查询的完整代码。非常感谢您的支持。

<?php
if(isset($_POST['gebiet1'])){
    $selected_val = $_POST['gebiet1'];  // Storing Selected Value In Variable
    echo "Sie haben " .$selected_val." selektiert.";  // Displaying Selected Value
}
?>

<?php
require_once ('config.php');
$db = mysqli_connect (
                     MYSQL_HOST, 
                     MYSQL_BENUTZER, 
                     MYSQL_KENNWORT, 
                     MYSQL_DATENBANK
                    );
?>

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST">
    <div id="select">
    <select name="gebiet1" onchange="this.form.submit();">

<?php
$gebietausgabe = mysqli_query($db, "SELECT DISTINCT Gebiet FROM kernfragen");
while ($row = $gebietausgabe->fetch_assoc())
{

  echo '<option value="' . $row['Gebiet'] . '">' . $row['Gebiet'] . '</option>';
}

?>

    </select>
    </div>
</form>

<?php        
if(isset($_POST['gebiet1'])){
$ergebnis = mysqli_query($db, "SELECT idKernfragen, Kernfrage FROM kernfragen WHERE Gebiet='".$selected_val."'");

while($row = mysqli_fetch_object($ergebnis))
{
  echo $row->idKernfragen;
  echo '.) ';
  echo $row->Kernfrage;
  print "<br>";
}
}
?>

Answer 1

如果您想避免完全重新加载页面，您需要避免提交表单，因为这会加载操作 url。

对于这种只修改页面的部分内容，您需要AJAX，这需要一个特殊的 javascritp 来触发请求并交换内容，还需要一个服务器脚本，它只返回您需要交换的部分（没有整个 html带有头部、css、...的页面）