Question

让我们保持简短和甜蜜。

这是我的标题：

<head>
    <title>4JSB Assignment</title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <script type="text/javascript" src="javascript/form.js"></script>
</head>

注意：<script type="text/javascript" src="javascript/form.js"></script>

似乎没有效果。

我在正文中有一个提交按钮，它是表单的一部分。它位于上述表格的末尾：

<input type=submit name="submitForm" id="submitForm" onclick="submitForm()">

这是我的外部javascript：

function submitForm() {
alert("Working");
}

唉，“工作”永远不会出现。

我的文件夹结构如下：

root
    css
    ....style.css

    javascript
    ....form.js

    form.html

答案很可能是微不足道的，但由于这一要求javascript是从外部来源链接的，因此让我坚持这个任务几个小时。我很感激任何指出这种世俗和不幸的事故的尝试。

Answer 1

问题是您有id="submitForm"和function submitForm

不确定为什么浏览器会这样做，但任何ID都可用作全局对象

所以，

console.log(submitForm);

将显示输入元素，而不是函数!!

为id或函数使用不同的名称

console.log(submitForm)实际上显示了这个功能!!但它最终仍然是一个名称冲突。

Answer 2

尝试将提交按钮的名称和ID更改为“submitButton”，以便它与您的javascript函数不完全相同。我相信名称冲突。

Answer 3

这取决于你想要做什么：

如果你在提交按钮上添加了一个onclick功能，它就不能用于提交表单，所以将它作为那样没有意义。

如果您想在提交表单之前执行javascript函数，或者想要执行一些可能会或可能不会阻止表单提交的验证。 最佳方式：

<form onsubmit="return submitform();">
    ....
    <input type=submit name="submitFormAny" id="submitFormAny">
</form>

同样正如其他贡献者所说的那样，要小心，你不能拥有相同身份的元素和功能

外部Javascript无效

3 个答案: