我有这个代码，它的工作原理是知道我在表格中输入的当天有多少人被预订。查询运行良好，并返回预期结果。问题是，我想在选择一个小时后显示这个结果，所以它不会显示给我。如果div的id结果日期或拉出选择不同的时间选项，我会看到结果。如何在选项中查看查询结果？
这是check_availability.php的文件。
require('config.php');
sleep(1);
$data = $_POST['data'];
$result = $connexion->query(
'SELECT persones FROM reservas where data = ''.$data.'' ORDER by hora ASC'
);
if ($result->num_rows > 0) {
foreach ($result as $hores){
echo $hores['persones'].' llocs disponibles.';
}
}
else{
echo 'Esta tot reservat';
}
<!DOCTYPE HTML>
<html>
<head>
<title>Rem la Ràpita</title>
<link rel="icon" type="image/png" href="../images/favicon.png" sizes="32x32"/>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--Comprovar la disponibilitat d'horari-->
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#data').on('blur', function(){
var data = $(this).val();
var dataString = 'data='+data;
$.ajax({
type: "POST",
url: "check_availablity.php",
data: dataString,
success: function(data) {
$('#result-data').fadeIn(1000).html(data);
}
});
});
});
</script>
</head>
<body>
<div class="container-login">
<div class="wrap-login" style="width: 1000px">
<!--<form class="login-form validate-form" action="bd/reservar.php" method="post">-->
<form class="login-form validate-form" action="bd/reservar.php" method="post">
<span class="login-form-title"></span>
<div class="row">
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate = "Nom incorrecte">
<input class="input100" type="text" id="nom" name="nom" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate = "Email incorrecto">
<input class="input100" type="text" id="apellidos" name="apellidos" placeholder="" >
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate = "Email incorrecto">
<input class="input100" type="text" id="email" name="email" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate="Telefon incorrecto">
<input class="input100" type="text" id="telefon" name="telefon" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate="Persones incorrecto">
<input class="input100" type="number" id="persones" name="persones" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate="Data incorrecto">
<input class="input100" type="date" id="data" name="data" placeholder="Fecha">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate="Hora incorrecto">
<select name="hora" id="hora" class="input100">
<option disabled selected></option>
<option value="12:00">12:00</option><div id="result-data"></div>
<option value="12:30">12:30</option>
<option value="13:00">13:00</option>
<option value="13:30">13:30</option>
<option value="14:00">14:00</option>
<option value="20:00">20:00</option>
<option value="20:30">20:30</option>
<option value="21:00">21:00</option>
<option value="21:30">21:30</option>
<option value="22:00">22:00</option>
<option value="22:30">22:30</option>
</select>
<span class="focus-efecto"></span>
</div>
<div class="container-login-form-btn">
<div class="wrap-login-form-btn">
<div class="login-form-bgbtn"></div>
<button type="submit" name="submit" class="login-form-btn">RESERVAR</button>
</div>
</div>
</div>
</form>
</div>
</div>
</body>
</html>您似乎正在尝试使用ajax来更改所选的选项？这是行不通的。选项上的div标记也不起作用。
select通常是由操作系统设计的，更改其中的内容并不容易。使用ajax在选项旁边显示内容是没有意义的。
如果您的目标是更新下拉列表，那么在用户打开它之前，请使用ajax替换完整的select元素，包括选项。