我知道这个问题已被多次询问,但我是新手。以下代码集在独立环境中工作。但是当插入预先存在的html文件时,由于某种原因它不起作用。函数stateChanged()及其下面的代码不会被执行。请帮帮我。
<script type=text/javascript>
function ajaxFunction(choice) {
var httpxml;
try {
// Firefox, Opera 8.0+, Safari
httpxml=new XMLHttpRequest();
}
catch (e) {
// Internet Explorer
try {
httpxml=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
httpxml=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {
alert("Your browser does not support AJAX!");
return false;
}
}
}
function stateChanged() {
alert('I am in the state changed');
if(httpxml.readyState===4) {
//alert(httpxml.responseText);
var myObject = JSON.parse(httpxml.responseText);
for(j=document.myForm.state.options.length-1;j>=0;j--) {
document.myForm.state.remove(j);
}
var state1=myObject.value.state1;
var optn = document.createElement("OPTION");
optn.text = 'Select State';
optn.value = '';
document.myForm.state.options.add(optn);
for (i = 0;i < myObject.state.length;i++) {
var optn = document.createElement("OPTION");
optn.text = myObject.state[i];
optn.value = myObject.state[i];
document.myForm.state.options.add(optn);
if(optn.value===state1) {
var k= i+1;
document.myForm.state.options[k].selected=true;
}
}
//////////////////////////
for(j=document.myForm.city.options.length-1;j>=0;j--) {
document.myForm.city.remove(j);
}
var city1=myObject.value.city1;
var optn = document.createElement("OPTION");
for (i=0;i<myObject.city.length;i++) {
var optn = document.createElement("OPTION");
optn.text = myObject.city[i];
optn.value = myObject.city[i];
document.myForm.city.options.add(optn);
if(optn.value===city1){
document.myForm.city.options[i].selected=true;
}
}
///////////////////////////
document.getElementById("txtHint").style.background='#00f040';
document.getElementById("txtHint").innerHTML='done';
//setTimeout("document.getElementById('txtHint').style.display='none'",3000)
}
}
var url="ajax-dd3ck.php";
var country=myForm.country.value;
if(choice !== 's1'){
var state=myForm.state.value;
var city=myForm.city.value;
}
else{
var state='';
var city='';
}
url=url+"?country="+country;
url=url+"&state="+state;
url=url+"&city="+city;
url=url+"&id="+Math.random();
myForm.st.value=state;
alert("I am in the ajax");
document.getElementById("txtHint2").innerHTML=url;
httpxml.onreadystatechange=stateChanged;
httpxml.open("GET",url,true);
httpxml.send(null);
document.getElementById("txtHint").innerHTML="Please Wait....";
document.getElementById("txtHint").style.background='#f1f1f1';
}
</script>
以下是选择框的代码
<?php
$sql = "SELECT DISTINCT(vehicle_make) FROM car_details";
$query = mysql_query($sql);
?>
<select name=country id='s1' onchange=ajaxFunction('s1');>
<option value="">Please Select</option>
<?php while ($rs = mysql_fetch_array($query)) { ?>
<option value="<?php echo $rs["vehicle_make"]; ?>"><?php echo $rs["vehicle_make"]; ?></option>
<?php } ?>
</select>
<label>Vehicle Model:<SPAN>Please select Vehicle Model</SPAN></label>
<select name=state onchange=ajaxFunction('s2');>
<option value=''>Select One</option>
</select>
<label>Vehicle Type:<SPAN>Please select Vehicle Type</SPAN></label>
<select name=city onchange=ajaxFunction('s3');>
<option value=''>Select One</option>
</select>