在文本区域显示未定义的javascript数组

javascript array displaying undefined in text area

本文关键字：javascript 数组 未定义 显示 文本 区域      更新时间：2023-09-26

所以我现在正在做一些家庭工作，很难理解为什么我的数组显示为未定义。很抱歉，如果这很简单，但我在这方面还很陌生。我会尽力解释我在这里做什么。

我有三个输入字段，收集学生的姓氏、名字和年级。我通过id获取所有这些元素，并将所有这些输入放入一个名为studentGrade的数组中。然后，我将该数组的内容推送到另一个名为grades的数组中，然后将其作为参数传递给名为get_item_list的函数。从那里我尝试循环浏览该参数的内容，这样我就可以将其显示到id为"scores"的文本字段中。

我真的很感激所有的投入，希望我能学到我做错了什么。

var grades = [];
var $ = function (id) { return document.getElementById(id); }
var update_display = function () {
    $("scores").value = get_item_list(grades);
    $("last_name").value = "";
    $("first_name").value = "";
    $("score").value = "";
$("last_name").focus();
}    
var student_grade_add_click = function() {
    var studentGrade = [];
    studentGrade["last_name"] = $("last_name").value;
    studentGrade["first_name"] = $("first_name").value;
    studentGrade["score"] = parseFloat($("score").value);
    if ( studentGrade["last_name"] == "" ) return;
    if ( studentGrade["last_name"] == "" ) return;
    if ( isNaN(studentGrade["score"]) ) return;
    grades.push(studentGrade);
    update_display();
}
var get_item_list = function(item_list) {
    if ( item_list.length == 0 ) {
       return "";
    }
    var list;
    for ( var i in item_list ) {
        list += item_list[i] + "'n";
    }
    return list;
}
window.onload = function () {
    $("add_button").onclick = student_grade_add_click;
    $("last_name").focus();
}

这是我正在使用的javascript

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Student Scores</title>
<link rel="stylesheet" type="text/css" href="default.css" />
<script type="text/javascript" src="student_scores.js"></script>
</head>
<body>
<div id="content">
    <h1>Student Scores</h1>
    <div class="formLayout">
        <label>Last Name:</label>
        <input type="text" id="last_name" /><br />
        <label>First Name:</label>
        <input type="text" id="first_name" /><br />
        <label>Score:</label>
        <input type="text" id="score" /><br />
        <label>&nbsp;</label>
        <input type="button" id="add_button" value="Add Student Score" /><br />
     </div>
    <h2>Student Scores</h2>
    <p><textarea id="scores" rows="5" cols="60"></textarea></p>
     <div class="formLayout">
        <label>Average score:</label>
        <input type="text" id="average_score"/><br />
        <label>&nbsp;</label>
        <input type="button" id="clear_button" value="Clear Student Scores" /><br />
        <label>&nbsp;</label>
        <input type="button" id="sort_button" value="Sort By Last Name" /><br />
    </div>
</body>
</html>

这是我做的html，再次感谢。

我认为在将值连接到list之前，需要将其初始化为字符串：

var get_item_list = function(item_list) {
    if ( item_list.length == 0 ) {
       return "";
    }
    var list = "";
    for ( var i = 0; i < item_list.length; i++) {
       var current = item_list[i];
       for ( var attr in current ) {
           list += current[attr] + "'n";
       }
    }
    return list;
}

此外，studentGrade不是数组，它是一个对象（即使您像数组一样设置键）：

var studentGrade = {};

我的更改工作，这是您更新的小提琴：http://jsfiddle.net/LFhNQ/1/

相关文章：