dropdown onchange事件无效

Question

我想在国家变化上填写另一个下拉列表的下拉，然后填写州和城市的变化。 我试图通过Ajax这样做，但它没有响应。 我写的代码是

<script type="text/javascript">
    $(document).ready(function(){
        load_options('','country');
    });

    function load_options(id,index){
        $("#loading").show();

        if(index=="state"){
            $("#city").html('<option value="">Select city</option>');
        }

        $.ajax({
            url: "/ajax.php?index="+index+"&id="+id,
            complete: function(){$("#loading").hide();},
            success: function(data) {
                $("#"+index).html(data);
            }
        })
    }
</script>

HTML：

<label>Select Country</label>
<select name="country" id="country" onChange="load_options(this.value,'state');">
    <option value="">Select country</option>
</select>

<label>Select State</label>
<select name="state" id="state" onChange="load_options(this.value,'city');">
    <option value="">Select state</option>
</select>

<label>Select city</label>
<select name="city" id="city">
    <option value="">Select City</option>
</select>

Ajax.php：

<?php
    class AJAX {
        private $database = NULL;
        private $_query = NULL;
        private $_fields = array();
        public  $_index = NULL;
        const DB_HOST = "localhost";
        const DB_USER = "root";
        const DB_PASSWORD = "12345";
        const DB_NAME = "AnandDb";

        public function __construct(){
            $this->db_connect();                 // Initiate Database connection
            $this->process_data();
        }
        /*
         *  Connect to database
        */

        private function db_connect(){
            $this->database = mysql_connect(self::DB_HOST,self::DB_USER,self::DB_PASSWORD);

            if($this->database){
                $db =  mysql_select_db(self::DB_NAME,$this->database);
                echo "Db connect.";
            } else {
                echo mysql_error();die;
                echo "Db Not connected.";
            }
        }

        private function process_data(){
            $this->_index = ($_REQUEST['index'])?$_REQUEST['index']:NULL;
            $id = ($_REQUEST['id'])?$_REQUEST['id']:NULL;
            switch($this->_index){
                case 'country':
                $this->_query = "SELECT country_id,country_name FROM tbl_country";
                $this->_fields = array('id','country_name');
                break;

                case 'state':
                $this->_query = "SELECT * FROM tbl_state WHERE country_id=$id";
                $this->_fields = array('id','state_name');
                break;

                case 'city':
                $this->_query = "SELECT * FROM tbl_city WHERE state_id=$id";
                $this->_fields = array('id','city_name');
                break;

                default:
                break;
            }
            $this->show_result();
        }

        public function show_result(){
            echo '<option value="">Select '.$this->_index.'</option>';
            $query = mysql_query($this->_query);
            while($result = mysql_fetch_array($query)){
                $entity_id = $result[$this->_fields[0]];
                $enity_name = $result[$this->_fields[1]];
                echo "<option value=".$entity_id.">".$enity_name."</option>";
            }
        }
    }
    $obj = new AJAX;
 ?>

Answer 1

我觉得没有任何其他错误。但是不要在javascript函数中使用id和index。重命名这些变量并尝试。试着提醒那两个人。

Answer 2

试试这个：

<select name="country" id="country" 
onChange="load_options(this.options[this.selectedIndex].value,'state');">