HTML（index.html）

Question

我无法弄清楚为什么我的外部javaScript不会链接到我的html代码。我究竟做错了什么？使用我的输入函数，我试图连接2个字符串并在空文本字段中输出新的字符串。

先谢谢你们！

HTML（index.html）

<head>
<title> Free GPA Calculator </title>
    <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="gpa_style.css" />
    <script type="text/javascript" src="gpacalc.js"></script>
</head>
<body>
    <div id="courseAddForm">
        <h1> Free GPA Calculator </h1>
        <form id="courseAdd">
            <label for="course" class="info" > Course </label>
            <input type="text" name="course" /><br />
            <label for="credits" class="info"> Number of Credits </label>
            <input type="text" name="credits" /><br />
            <label for="grade" class="info"> Letter Grade </label>
            <input type="text" name="grade" /><br />
            <div id="buttons">
                <input type="button" value="Submit" onclick="input()" />
                <input type="reset" value="Clear" />
             </div>
            <input type="text" name="exp" />
        </form>
</body>

JavaScript（gpacalc.js）

function input() {
    var doc = document.getElementById("courseAdd");
    var course = doc.course.value;
    var credits = doc.credits.value;
    var grade = doc.grade.value;
    doc.exp.value = course + credits;
}

Answer 1

请参阅fiddle

对点击功能使用如下jQuery，它可以工作!!!

<强> JS

$(document).ready(function () {
    function input() {

        var doc = document.getElementById("courseAdd");
        var course = doc.course.value;
        var credits = doc.credits.value;
        var grade = doc.grade.value;
        doc.exp.value = course + credits;
    }
    $('#myButton').on('click', input);
});

另外，我已经更换了

<input type="button" value="Submit" onclick="input()" />

与

<input type="button" value="Submit" id="myButton" />

在您的HTML中

。

外部JavaScript链接无法正常工作

HTML（index.html）

JavaScript（gpacalc.js）

1 个答案:

请参阅fiddle