0

我在循环中动态地在我的 html 页面上创建隐藏值，并尝试使用所述值来创建图表，但似乎无法使用 document.getElementByID 访问。

因此，它从 servlet 中获取名称和编号。这

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
<link rel="stylesheet" type="text/css" href="buttons.css">
<link rel="stylesheet" type="text/css" href="${skin}.css">
<link rel="stylesheet" type="text/css" href="tables.css">
<link href='http://fonts.googleapis.com/css?family=Oswald'
    rel='stylesheet' type='text/css'>
<title>Hello ${user}</title>

<title>Radar Chart</title>
<script src="Chart.js"></script>
<meta name="viewport" content="initial-scale = 1, user-scalable = no">
<style>
canvas {

}
</style>

</head>
<body>
    <center>
        <br>
        <div class="container">
            <h1>Number of Trades Per Stock Exchange</h1>
        </div>

        <div id="container">
            <table class="zebra">
                <thead>
                    <tr>
                        <th scope="col">Company</th>
                        <th scope="col">Number of Trades Made</th>
                    </tr>
                </thead>
                <tbody>
                    <c:forEach items="${first}" varStatus="loop">
                        <tr>
                            <td><c:out value="${first[loop.index]}" /></td>
                            <td><c:out value="${price[loop.index]}" /></td>
                            <input type="hidden" id="${first[loop.index]}"
                                value="${price[loop.index]}" />
                        </tr>
                    </c:forEach>
                </tbody>
            </table>
        </div>
        <br>

        <canvas id="canvas" height="450" width="450"></canvas>

        <script>
            var pieData = [ {
                value : document.getElementById("London Stock Exchange"),
                color : "#F38630"
            }, {
                value : document.getElementById("BombayStockExchange"),
                color : "#E0E4CC"
            }, {
                value : document.getElementById("New York Stock Exchange"),
                color : "#69D2E7"
            }

            ];

            var myPie = new Chart(document.getElementById("canvas").getContext(
                    "2d")).Pie(pieData);
        </script>

        <br> <br>

        <div id="inline-link-1">
            <a href="semanagerpanelredirect">Return to Stock Exchange Manager
                panel</a>
        </div>
    </center>
</body>
</html>

这是我加载页面时的源代码：

<html>

<head>

<link rel="stylesheet" type="text/css" href="buttons.css">

<link rel="stylesheet" type="text/css" href="blue.css">

<link rel="stylesheet" type="text/css" href="tables.css">

<link href='http://fonts.googleapis.com/css?family=Oswald'

    rel='stylesheet' type='text/css'>

<title>Hello LondonManager</title>



<title>Radar Chart</title>

<script src="Chart.js"></script>

<meta name="viewport" content="initial-scale = 1, user-scalable = no">

<style>

canvas {



}

</style>



</head>

<body>

    <center>

        <br>

        <div class="container">

            <h1>Number of Trades Per Stock Exchange</h1>

        </div>



        <div id="container">

            <table class="zebra">

                <thead>

                    <tr>

                        <th scope="col">Company</th>

                        <th scope="col">Number of Trades Made</th>

                    </tr>

                </thead>

                <tbody>



                        <tr>

                            <td>London Stock Exchange</td>

                            <td>23</td>

                            <input type="hidden" id="London Stock Exchange"

                                value="23" />

                        </tr>



                        <tr>

                            <td>BombayStockExchange</td>

                            <td>1</td>

                            <input type="hidden" id="BombayStockExchange"

                                value="1" />

                        </tr>



                        <tr>

                            <td>New York Stock Exchange</td>

                            <td>9</td>

                            <input type="hidden" id="New York Stock Exchange"

                                value="9" />

                        </tr>



                </tbody>

            </table>

        </div>

        <br>



        <canvas id="canvas" height="450" width="450"></canvas>



        <script>

            var pieData = [ {

                value : document.getElementById("London Stock Exchange"),

                color : "#F38630"

            }, {

                value : document.getElementById("BombayStockExchange"),

                color : "#E0E4CC"

            }, {

                value : document.getElementById("New York Stock Exchange"),

                color : "#69D2E7"

            }



            ];



            var myPie = new Chart(document.getElementById("canvas").getContext(

                    "2d")).Pie(pieData);

        </script>



        <br> <br>



        <div id="inline-link-1">

            <a href="semanagerpanelredirect">Return to Stock Exchange Manager

                panel</a>

        </div>

    </center>

</body>

</html>

我可以设置值但无法获取它们。任何帮助，将不胜感激。

4

2 回答 2

1

您传递的是 DOM 元素，而不是它们的值。

代替

            value : document.getElementById("London Stock Exchange"),

和

            value : document.getElementById("London Stock Exchange").value,

而且，正如 Devang Rathod 所提到的，您的 id 中不应包含空格（请参阅参考资料）。

于 2013-09-06T10:23:39.120 回答
0

使用 document.getElementById("London Stock Exchange").value 或者您可以使用更简单的 jquery。例如 : ("#London Stock Exchange").val();

于 2013-09-06T10:37:18.767 回答