Question

我有这个html表单，可将数据添加到json数组文件中

'You've changed the food price from' + previous food price + 'to' + after update food price

和下面是AddBook.js

<head>
        <script type="text/javascript" src="require.js"></script>
        <script type="text/javascript" src="AddBook.js"></script>
    </head>
    <body>
        <form id="add">
            <input type="text" id="isbn" name="isbn">
            <br>
            <input type="text" id="title" name="title">
            <br>
            <input type="text" id="author" name="author">
            <br>
            <input type="text" id="issued" name="issued">
            <br>
            <input type="submit" name="submit">
        </form>
        <script>
                var x = document.getElementById("add");
                var isbn = x.elements[0].value;
                var title = x.elements[1].value;
                var author = x.elements[2].value;
                var issued = x.elements[3].value;
                write(isbn,title,author,issued);
        </script>

问题在于以下脚本可作为独立文件使用，但一旦与HTML一起使用，便立即停止工作。如何使该脚本与表单一起使用

Answer 1

尝试添加功能以在表单上的提交中运行。像这样：

<head>
    <script type="text/javascript" src="require.js"></script>
    <script type="text/javascript" src="AddBook.js"></script>
    <script>
        function writeToJSON(){
            var x = document.getElementById("add");
            var isbn = x.elements[0].value;
            var title = x.elements[1].value;
            var author = x.elements[2].value;
            var issued = x.elements[3].value;
            write(isbn,title,author,issued);
        }
    </script>
</head>
<body>
    <form id="add" onsubmit="writeToJSON()">
        <input type="text" id="isbn" name="isbn">
        <br>
        <input type="text" id="title" name="title">
        <br>
        <input type="text" id="author" name="author">
        <br>
        <input type="text" id="issued" name="issued">
        <br>
        <input type="submit" name="submit">
    </form>
</body>

如何使用JS从表单向JSON数组文件添加元素

1 个答案: