Ajax Country City选择菜单onChange()不起作用

时间:2013-07-05 20:39:52

标签: php javascript ajax onchange

我遇到了一个很好的教程,可以创建可以动态更改的下拉菜单。

这是链接。

http://roshanbh.com.np/2008/01/populate-triple-drop-down-list-change-options-value-from-database-using-ajax-and-php.html

这是演示

http://roshanbh.com.np/dropdown/


我正在摆弄代码,我正在跳过你选择状态的部分。

这是findCity.php文件

<!--//---------------------------------+
//  Developed by Roshan Bhattarai    |
//  http://roshanbh.com.np           |
//  Contact for custom scripts       |
//  or implementation help.          |
//  email-nepaliboy007@yahoo.com     |
//---------------------------------+-->
<?
#### Roshan's Ajax dropdown code with php
#### Copyright reserved to Roshan Bhattarai - nepaliboy007@yahoo.com
#### if you have any problem contact me at http://roshanbh.com.np
#### fell free to visit my blog http://php-ajax-guru.blogspot.com
?>

<? $country = $_GET['country'];
$link  = mysql_connect("snip","snip","snip");
if (!$link) {
    die('Could not connect: ' . mysql_error());
}
mysql_select_db('snip');
$query="SELECT city FROM location WHERE country='$country'";
$result=mysql_query($query);

?>
<select name="city">
<option>Select City</option>
<? while($row=mysql_fetch_array($result)) { ?>
<option value><?=$row['city']?></option>
<? } ?>
</select>

使用国家/地区变量打开findCity.php可以正常工作

http://globatum.com/admin/findCity.php?country=United%20States

我无法弄清楚为什么国家/地区列表中的值没有正确地通过此功能

function getCity(country) {
        var strURL="findCity.php?country="+ country;
        var req = getXMLHTTP();

        if (req) {

            req.onreadycountrychange = function() {
                if (req.readyState == 4) {
                    // only if "OK"
                    if (req.status == 200) {                        
                        document.getElementById('citydiv').innerHTML=req.responseText;                      
                    } else {
                        alert("There was a problem while using XMLHTTP:\n" + req.statusText);
                    }
                }               
            }           
            req.open("GET", strURL, true);
            req.send(null);
        }

    }

这里有什么想法吗?

添加说明

function getXMLHTTP() { //function to return the xml http object
        var xmlhttp=false;  
        try{
            xmlhttp=new XMLHttpRequest();
        }
        catch(e)    {       
            try{            
                xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e){
                try{
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                }
                catch(e1){
                    xmlhttp=false;
                }
            }
        }

        return xmlhttp;
    }

2 个答案:

答案 0 :(得分:2)

页面上有一个javascript错误,@nevermind打败了我指出。那很好,但是你有另一个问题似乎只是对你的误解。这条线

req.onreadycountrychange = function() {

没有意义,需要改为:

req.onreadystatechange = function() {

在这种情况下,函数onreadystatechange的名称有点令人困惑,但它与“状态/国家”中的“状态”没有任何关系。这是指XMLHttpRequest对象的当前状态。基本上,只要更新请求对象的状态,就会调用该函数onreadystatechange

在此处详细了解:http://www.w3schools.com/ajax/ajax_xmlhttprequest_onreadystatechange.asp

答案 1 :(得分:0)

您在代码中的语法错误,在测试页上:

if (req.readyState == 4 {

当然应该是:if (req.readyState == 4 )

如果这不能解决问题,我们可以尝试其他方法。 :)