Question

我正在创建一个链接到Web服务的网页，以显示商店名称列表。我创建了一个指向Web服务的链接，并创建了一个名为GetOrders的onclick函数。我把它放在我的HTML5页面和我的JavaScript页面中，并将它们链接在一起。但是，当我尝试运行应用程序时，没有任何反应。我已经使用Internet Explorer上的调试工具来跟踪我的代码，但它只显示按钮已被点击，没有别的。我没有执行任何JavaScript代码。我的JavaScript代码中唯一可用的部分是我的菜单选择功能。能否请你帮我找出为什么我的GetOrders功能没有被执行？

我的HTML5页面：

<!DOCTYPE html>

<html>
<head>
    <title>Adam Zeidan Assignment 4</title>
    <link rel="stylesheet" type="text/css" href="styles/Assignment4.css" />
    <script src="js/Assignment4.js"></script>


</head>

<body>
    <section id="title">
     <h1>Module 4 Demonstration</h1>
        <hr>
        <select onchange="MenuChoice()" id="menu">
           <option>Please select an option</option>
           <option>Store List</option>
           <option>Order History</option>
        </select>
      <hr>
    </section>
    <section id="section1" class="section1">
     <h2>This is section one!</h2>
        <button onclick="GetOrders()" id="orders">Display Store List</button>
        <br>
        <br>
        <label id="storelistdisplay">The store list will be displayed here.    </label>
    </section>
    <section id="section2" class="section2">
     <h2>This is section two!</h2>
    </section>



</body>
</html>

我的JavaScript页面：

function MenuChoice()
{
    {
     if (document.getElementById("menu").value == "Store List")
    {
     document.getElementById("section1").style.visibility = "visible";
     document.getElementById("section2").style.visibility = "hidden";
    }
     else if (document.getElementById("menu").value == "Order History")
    {
     document.getElementById("section1").style.visibility = "hidden";
     document.getElementById("section2").style.visibility = "visible";
    }
     else
    {
     document.getElementById("section1").style.visibility = "hidden";
     document.getElementById("section2").style.visibility = "hidden";
    }
}

function GetOrders()
    {
        var objRequest = new XMLHttpRequest(); //Create AJAX request object

        //Create URL and Query string
        var url = "http://bus-    pluto.ad.uab.edu/jsonwebservice/service1.svc/getAllStores/";
        url += document.getElementById("custid").value;

        //Checks that the object has returned data
        objRequest.onreadystatechange = function()
            {
                if (objRequest.readyState == 4 && objRequest.status == 200)
                {
                    var output = JSON.parse(objRequest.responseText);
                    GenerateOutput(output);
                }
            }
        //initiate server request
        objRequest.open("GET", url, true);
        objRequest.send();
    }
}
function GenerateOutput (result)
{
    var count = 0;
    var displaytext = "";

    //This loop will extract data from the data recieved from the server
    for (count = 0; count < result.GetAllStoresResult.Length; count++)
    {
        displaytext = result.GetAllStoresResult[count].StoreID + ", " +     result.GetAllStoresResult[count].StoreName + ", " +     result.GetAllStoresResult[count].StoreCity + "<br>";
    }

    document.getElementById("storelistdisplay").innerHTML = displaytext;
}

Answer 1

就像Marc B上面评论的那样，可能错误的{导致了你的问题。在MenuChoice()中，第一个if语句在if语句之前打开大括号，而不是在if子句之后。

Answer 2

JS文件上的小错字错误，额外＆＃34;}＆＃34;在GetOrders功能。我纠正了。使用以下代码。

function GetOrders()
    {
        var objRequest = new XMLHttpRequest(); //Create AJAX request object

        //Create URL and Query string
        var url = "http://bus-    pluto.ad.uab.edu/jsonwebservice/service1.svc/getAllStores/";
        url += document.getElementById("custid").value;

        //Checks that the object has returned data
        objRequest.onreadystatechange = function()
            {
                if (objRequest.readyState == 4 && objRequest.status == 200)
                {
                    var output = JSON.parse(objRequest.responseText);
                    GenerateOutput(output);
                }
            }
        //initiate server request
        objRequest.open("GET", url, true);
        objRequest.send();
    }

为什么我的onclick没有链接到我的Javascript？

2 个答案: