Question

我有一个HTML列表。根据单击的按钮，应该进行AJAX调用并显示数据。但是，JavaScript无法读取按钮。这是HTML中的代码

<ul>
        <li><input type = "button" name = "lab" id = "map" value = "Computer Lab" onClick = "openPage(this)"></li>

        <li><input type = "button" name = "lib" id = "map" value = "Library" onClick = "openPage(this)"></li>

        <li><input type = "button" name = "mlib" id = "map" value = "Manuscript Library" onClick = "openPage(this)"></li>

        <li><input type = "button" name = "radio" id = "map" value = "Agra ki Aawaz" onClick = "openPage(this)"></li>
      </ul>

这是javascript代码

function openPage(page){
try {
    xmlHttp = new XMLHttpRequest ();
}
catch (e) {
    try {
        xmlHttp = new ActiveXObject ("Microsoft.XMLHTTP");
    }
    catch (el) {
        try {
            xmlHttp = new ActiveXObject ("Msxml2.XMLHTTP");
        }
        catch (el1) {
            alert ("Your browser does not support AJAX! Please use a compatible browser!!");
        }
    }
}

xmlHttp.onreadystatechange = function () {
    if (xmlHttp.readyState == 4 && xmlHttp.state == 200) {
        var sp = documet.getElementByID ("mainText");
        sp.innerHTML = xmlHttp.responseText;
    }
};

var target = "";
var parent = "";
var page = "";

switch(page.name){
case 'lab':
    target = "get_content.jsp";
    parent = "kmi";
    page = "lab";
    break;
case 'lib':
    targt = "get_content.jsp";
    parent = "kmi";
    page= "gen_lib";
    break;
case 'mlib':
    targt = "get_content.jsp";
    parent = "kmi";
    page= "man_lib";
    break;
case 'radio':
    targt = "get_content.jsp";
    parent = "kmi";
    page= "radio";
    break;
}
xmlHttp.open("POST", target, false);
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;");
xmlHttp.send("parent=" + parent + "&page=" + page);

现在的问题是page.name即将成为undefined。

我不明白它有什么问题，是否可以创建这样的按钮列表并使用这些按钮进行导航？

Answer 1

在您的switch声明之上，您有：

var page = "";

因为你的函数定义如下所示：

function openPage(page){

JavaScript删除了var（变量已经声明），只是将""（一个空字符串）赋给曾经是DOM元素的引用。修复名称冲突，你应该在路上

按钮列表和JavaScript

1 个答案: