使用Ajax的下拉列表_Ajax - Fatal编程技术网

使用Ajax的下拉列表

ajax

使用Ajax的下拉列表,ajax,Ajax,我写了下面的代码；当我在与某些内容相关的文本文件下拉列表中选择India/America时，必须在div元素中读取并显示，但在xhr.send（）行中出现错误。有人能解释一下原因吗？？ <html> <head> <script> function getcity() { var a=document.getElementById("country"); var b=a[a.selectedIndex].value; alert(b)

我写了下面的代码；当我在与某些内容相关的文本文件下拉列表中选择

India/America

时，必须在

div

元素中读取并显示，但在

xhr.send（）行中出现错误。

有人能解释一下原因吗？？

<html>
<head>
<script>
function getcity()
{
    var a=document.getElementById("country");
    var b=a[a.selectedIndex].value;
    alert(b);
    var xhr=new XMLHttpRequest();
    if(b=="India")
    {
        xhr.onreadystatechange=function()
        {
            if((xhr.readystate==4)&&(xhr.status==200||xhr.status==304))
            {
                document.getElementByID("display").innerHTML=xhr.responseText;
            }
        }
        xhr.open("GET","india.txt",true);
    }
    else
    {
        xhr.onreadystatechange=function()
        {
            if((xhr.readystate==4)&&(xhr.status==200||xhr.status==304))
            {
                document.getElementByID("display").innerHTML=xhr.responseText;
            }
        }
        xhr.open("GET","america.txt",true);
    }
    xhr.send(null);
}
</script>
</head>
<body>
<select id="country" onchange="getcity()">
<option>India</option>
<option>America</option>
</select>
<div id="display"></div>
</body>
</html>


函数getcity（）
{
var a=document.getElementById（“国家”）；
变量b=a[a.selectedIndex]。值；
警报（b）；
var xhr=new XMLHttpRequest（）；
如果（b=“印度”）
{
xhr.onreadystatechange=函数（）
{
if（（xhr.readystate==4）和&（xhr.status==200 | | xhr.status==304））
{
document.getElementByID（“display”）.innerHTML=xhr.responseText；
}
}
open（“GET”，“india.txt”，true）；
}
其他的
{
xhr.onreadystatechange=函数（）
{
if（（xhr.readystate==4）和&（xhr.status==200 | | xhr.status==304））
{
document.getElementByID（“display”）.innerHTML=xhr.responseText；
}
}
xhr.open（“GET”，“america.txt”，true）；
}
xhr.send（空）；
}
印度
美国


函数getcity（）
{
var a=document.getElementById（“国家”）；
变量b=a[a.selectedIndex]。值；
警报（b）；
var xhr=new XMLHttpRequest（）；
如果（b=“印度”）
{
xhr.onreadystatechange=函数（）
{
if（（xhr.readystate==4）和&（xhr.status==200 | | xhr.status==304））
{
document.getElementByID（“display”）.innerHTML=xhr.responseText；
}
}
open（“GET”，“india.txt”，true）；
}
其他的
{
xhr.onreadystatechange=函数（）
{
if（（xhr.readystate==4）和&（xhr.status==200 | | xhr.status==304））
{
document.getElementByID（“display”）.innerHTML=xhr.responseText；
}
}
xhr.open（“GET”，“america.txt”，true）；
}
xhr.send（空）；
}
印度
美国

从xhr.send（null）中删除

null

；我尝试了Rajesh…但它仍然没有显示文本文件中的内容…内容只是一个普通的StringRemove xhr。status==304使用

xhr.send（）尝试后出现了什么错误也许这会有帮助…但是为什么我得不到输出…我必须进行任何端口配置吗？？？我的系统中本地存储了该文件，，，该文件的URL如何？？？将该文件放在驱动器路径C:\xampp\htdocs\YourFile.html中。然后打开浏览器并键入地址栏localhost\YourFile.html。这是使用XAMPP
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
function getcity()
{
    var a=document.getElementById("country");
    var b=a[a.selectedIndex].value;
    alert(b);
    var xhr=new XMLHttpRequest();
    if(b=="India")
    {
        xhr.onreadystatechange=function()
        {
            if((xhr.readystate==4)&&(xhr.status==200||xhr.status==304))
            {
                document.getElementByID("display").innerHTML=xhr.responseText;
            }
        }
        xhr.open("GET","india.txt",true);
    }
    else
    {
        xhr.onreadystatechange=function()
        {
            if((xhr.readystate==4)&&(xhr.status==200||xhr.status==304))
            {
                document.getElementByID("display").innerHTML=xhr.responseText;
            }
        }
        xhr.open("GET","america.txt",true);
    }
    xhr.send(null);
}
</script>
</head>
<body>
<select id="country" onchange="getcity()">
<option>India</option>
<option>America</option>
</select>
<div id="display"></div>
</body>
</html>