在Select Onchange属性上不执行Javascript / Ajax函数

时间:2014-11-15 14:04:26

标签: jquery ajax

我知道这个问题已被多次询问,但我是新手。以下代码集在独立环境中工作。但是当插入预先存在的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>

0 个答案:

没有答案