使用XML级联下拉,javascript有问题

时间:2014-02-22 13:34:35

标签: javascript html xml

这是我的代码。我正在尝试使用DropDown boxjavascript在html中创建级联XML,我几乎接近结束,但我无法让它工作,有人可以关闭这对我来说?

我的剧本

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>

<EMPLOYEES xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
    <RECORD>
        <DEPARTMENT>Operations</DEPARTMENT>
        <DESIGNATION>Assistant Manager</DESIGNATION>
        <NAME>Abhijit Khamkar</NAME>
        <SUPERVISOR>Vamsee Nidiganti</SUPERVISOR>
        <CTC>5541601.5100909</CTC>
    </RECORD>
    <RECORD>
        <DEPARTMENT>Operations</DEPARTMENT>
        <DESIGNATION>Team Leader</DESIGNATION>
        <NAME>Elish Anand</NAME>
        <SUPERVISOR>Abhijit Khamkar</SUPERVISOR>
        <CTC>4356182.71368286</CTC>
    </RECORD>
</EMPLOYEES>

我的HTML

<html>
<head>
<meta charset="utf-8"/>
<title>Attendance Drop Down</title>
</head>
<body>
<div id="update" ></div>
<script>
var request;
if (window.XMLHttpRequest) {
    request = new XMLHttpRequest();
} else {
    request = new ActiveXObject("Microsoft.XMLHTTP");
}
request.open('GET','Employee.xml')
request.onreadystatechange = function() {
    if((request.readyState===4) &&
        (request.status===200)) {
        var items = request.responseXML.getElementsByTagName('DEPARTMENT');
        var output = '<select id="departments" onchange="update();">'; 
        for (var i = 0; i < items.length; i++) {
            output += '<option>' + 
            items[i].firstChild.nodeValue +'</option>';
        }
        output += '</select>';
        document.getElementById('update').innerHTML = output;
}
}
function update(){
var request;
if (window.XMLHttpRequest) {
    request = new XMLHttpRequest();
} else {
    request = new ActiveXObject("Microsoft.XMLHTTP");
}
request.open('GET','Employee.xml')
request.onreadystatechange = function() {
    if((request.readyState===4) &&
        (request.status===200)) {
        var items = request.responseXML.getElementsByTagName('DESIGNATION');
        var output = '<select id="designations">'; 
        for (var i = 0; i < items.length; i++) {
            output += '<option>' + 
            items[i].firstChild.nodeValue +'</option>';
        }
        output += '</select>';
        document.getElementById('update').innerHTML = output;
}
}
}
request.send();
</script>
</body>

</html>

1 个答案:

答案 0 :(得分:0)

您需要添加:

request.send();

在你的更新功能中,你所拥有的功能在外面并用于进行初始调用,但在调用更新函数时不会被调用。

<html>
<head>
<meta charset="utf-8"/>
<title>Attendance Drop Down</title>
</head>
<body>
<div id="update" ></div>
<script>

var request;
if (window.XMLHttpRequest) {
    request = new XMLHttpRequest();
} else {
    request = new ActiveXObject("Microsoft.XMLHTTP");
}
request.open('GET','Employee.xml')
request.onreadystatechange = function() {
    if((request.readyState===4) &&
        (request.status===200)) {
        var items = request.responseXML.getElementsByTagName('DEPARTMENT');
        var output = '<select id="departments" onchange="update();">'; 
        for (var i = 0; i < items.length; i++) {
            output += '<option>' + 
            items[i].firstChild.nodeValue +'</option>';
        }
        output += '</select>';
        document.getElementById('update').innerHTML = output;
    }
}
request.send();

function update(){
    var request;
    if (window.XMLHttpRequest) {
        request = new XMLHttpRequest();
    } else {
        request = new ActiveXObject("Microsoft.XMLHTTP");
    }
    request.open('GET','Employee.xml')
    request.onreadystatechange = function() {
        if((request.readyState===4) &&
            (request.status===200)) {
            var items = request.responseXML.getElementsByTagName('DESIGNATION');
            var output = '<select id="designations">'; 
            for (var i = 0; i < items.length; i++) {
                output += '<option>' + 
                items[i].firstChild.nodeValue +'</option>';
            }
            output += '</select>';
            document.getElementById('update').innerHTML = output;
        }
    }
    request.send();
}
</script>
</body>