我想使用ajax函数从网页的主文件刷新一个表。当选择框改变其值时,必须执行函数dayChanged()
。这个函数在文件"ajax.js"中。问题是,当我选择选择框的另一个选项时,什么都不会发生。我包括这样的文件:<script src="ajax.js></script>
。我希望将选择框的值发送到MySQL查询(该查询位于"config.php"中),然后刷新主文件的表。主要内容如下:
<html>
<head>
<style type="text/css">
body {
background-color: #9C3;
}
p {color:black;}
.table_test {
font-family: Constantia, Lucida Bright, DejaVu Serif, Georgia, serif;
}
</style>
<script src="ajax.js"></script>
</head>
<body><div align='center'>
<div class="table_test">
<table border='1' cellpadding='0' cellspacing='0' width='600' bgcolor='#F6F6F6' bordercolor='#FFFFFF'>
<tr>
<td width='150' style='font-weight: bold'></td>
<td width='150' style='font-weight: bold'>Festa</td>
<td width='150' style='font-weight: bold'>Preu</td>
<td width='150' style='font-weight: bold'>Entrada</td>
<td width='150' style='font-weight: bold'>Final</td>
<td width='150' style='font-weight: bold'>Estil</td>
<td width='150' style='font-weight: bold'>Llista</td>
</tr>
<form name="form1" method="post">
<div id="table_var">
<?php
include ('functions.php');
$dw = date("w");
display_table_by_day($dw);
?>
</table>
</div>
<p>Veure un altre dia de la setmana:
<select name="select_day" id="day_select" onChange="dayChanged()">
<option value="1">Dilluns</option>
<option value="2">Dimarts</option>
<option value="0">Diumenge</option>
</select>
</p>
</form>
</body>
</html>
函数display_table_by_day($dw)正常工作。ajax.js文件是:
function dayChanged()
{
var buscaAjax;
if(window.XMLHttpRequest)
{
buscaAjax = new XMLHttpRequest();
}else{
buscaAjax = new ActiveXOject("Microsoft.XMLHTTP");
}
buscaAjax.onreadystatechange = function(){
if(buscaAjax.readyState==4 && buscaAjax.status==200){
document.getElementById('table_var').innerHTML = buscaAjax.responseText;
}
}
var dato = document.form1.select_day.value;
buscaAjax.open("GET","config.php?variable="+dato,true);
buscaAjax.send();
}
最后,config.php文件是:
<?php
error_reporting(E_ALL ^ E_NOTICE);
include ('connection.php');
include ('functions.php');
$dw = $_GET['variable'];
display_table_by_day($dw);
?>
知道为什么不起作用吗?
您正在按名称引用select
:
var dato = document.form1.select_day.value;
将其更改为select
的id
,如下所示:
var dato = document.form1.day_select.value;