Question

我正在学习javascript，我正在尝试创建一个能够给我们提供结果的表格。

function showResult() {
    var viewResult = document.getElementById('demo');
    var inputOne = document.getElementById("studentName").value;
    var inputTwo = document.getElementById("studentsubj").value;
    var stuName = studentName.indexOf(inputOne);
    var subName = subjectName.indexOf(inputTwo);
    var result = markes[stuName][subName];
    viewResult.innerHTML = "This is the marks of " + inputOne + " " + inputTwo + " " + result + " %";
}

在控制台中，当我单击带有空白输入字段的输入按钮时，我在javascript中收到错误

这是错误：

“demo.js：408 Uncaught TypeError：无法读取属性'-1'未定义“

我的代码出了什么问题。

Answer 1

您应该检查学生和科目是否存在。

＆＃13;

var studentName = ["Bruce", "Clark", "Barry", "Diana", "Victor", "Billy"];
var subjectName = ["English", "Math", "History", "Geography", "Physics", "Biology"];
var markes = [
    [99, 98, 97, 98, 99, 90],
    [98, 90, 96, 99, 98, 95],
    [95, 98, 94, 90, 97, 91],
    [99, 97, 94, 90, 96, 92],
    [69, 89, 79, 59, 65, 90],
    [50, 90, 91, 66, 70, 80]
];
function showResult() {

    var inputOne = document.getElementById("studentName").value;
    var inputTwo = document.getElementById("studentsubj").value;

    var stuName = studentName.indexOf(inputOne);
    var subName = subjectName.indexOf(inputTwo);

    if (stuName < 0) {
        alert("Student not found");
        return;
    }
    if (subName < 0) {
        alert("Subject not found");
        return;
    }
    var result = markes[stuName][subName];
    alert(result);
    document.querySelector('input').value = "";
}

＆＃13;

<table border="1" width="auto">
    <tr>
        <td>Name</td>
        <td>English</td>
        <td>Math</td>
        <td>History</td>
        <td>Geography</td>
        <td>Physics</td>
        <td>Biology</td>
    </tr>
    <tr>
        <td>Bruce</td>
        <td>99%</td>
        <td>98%</td>
        <td>97%</td>
        <td>98%</td>
        <td>99%</td>
        <td>90%</td>
    </tr>

    <tr>
        <td>Clark</td>
        <td>98%</td>
        <td>90%</td>
        <td>96%</td>
        <td>99%</td>
        <td>98%</td>
        <td>95%</td>
    </tr>

    <tr>
        <td>Barry</td>
        <td>95%</td>
        <td>98%</td>
        <td>94%</td>
        <td>90%</td>
        <td>97%</td>
        <td>91%</td>
    </tr>

    <tr>
        <td>Diana</td>
        <td>99%</td>
        <td>97%</td>
        <td>94%</td>
        <td>90%</td>
        <td>96%</td>
        <td>92%</td>
    </tr>
    <tr>
        <td>Victor</td>
        <td>69%</td>
        <td>89%</td>
        <td>79%</td>
        <td>59%</td>
        <td>65%</td>
        <td>90%</td>

    </tr>
    <tr>
        <td>Billy</td>
        <td>50%</td>
        <td>90%</td>
        <td>91%</td>
        <td>66%</td>
        <td>70%</td>
        <td>80%</td>
    </tr>
</table>
<br>
<br>
<form>
    <input type="text" id="studentName">
    <input type="text" id="studentsubj">
    <input type="button" name="submit" value="submit" onclick="showResult()" />
</form>
<p id=demo></p>

＆＃13;

相同的代码HERE, Update for your link

Answer 2

如果输入字段为空var stuName = studentName.indexOf(inputOne);和var subName = subjectName.indexOf(inputTwo); 将返回-1。所以var result = markes[stuName][subName];将是var result = markes[-1][-1];这是控制台错误的原因。

在控制台中，当我单击带有空白字段的输入按钮时，我在javascript中收到错误

2 个答案: