Question

我有非常简单的html和js文件 - 我在下面包含这些文件。

有趣（令人沮丧的是）这些文件在Safari中有效 - 但在Firefox中，按“提交”按钮会生成以下错误消息：

错误：未定义sFeedback

源文件：javascript：sFeedback（）;行：1

阅读JavaScript function not defined in Firefox?之类的其他帖子，似乎Firefox可能需要在调用之前定义函数。如果是这种情况，有没有办法 - 在我的设置中 - 在调用之前定义函数？

quiz.html：

<!DOCTYPE html>
<html>
<head>
    <title>Math Quiz</title>
    <meta name="generator" content="BBEdit 9.6" />
</head>
<script language="JavaScript" src="generateQuizItem.js">
</script>

<body onLoad="javascript:sGenerateQuizItem();">


</body>
</html>

和javascript：

var a0;
var a1;
var sum;

function sFeedback()
    {
    var answer = document.quiz_form.answer.value;
    document.write("answer = " + answer + "<br>");
    if (answer == sum)
        document.write("Right!<br>");
    else
        document.write("Wrong!<br>");
    }

function sGenerateQuizItem()
    {
    a0 = 20;
    a1 = 40;
    sum = a0 + a1;

    document.write("<form action=\"javascript:sFeedback();\" method=\"get\" name=\"quiz_form\">\n");
    document.write(a0 + " + " + a1 + " = ");
    document.write("<input name=\"answer\" id=\"answer\" type=\"text\" size=\"4\" maxlength=\"4\" /><br><br>\n");
    document.write("<button type=\"submit\" id=\"submit\">Submit</button>");
    document.write("</form>");
    }

Answer 1

尝试将脚本引用放在文档的头部。

<!DOCTYPE html>
<html>
<head>
    <title>Math Quiz</title>
    <script src="generateQuizItem.js"></script>
</head>
<body onLoad="sGenerateQuizItem();">

</body>
</html>

Answer 2

好的，你有一些奇怪的事情发生了。

document.write是一个奇怪的事情，根据你什么时候调用它，它的行为会有所不同。如果它在页面加载期间运行，那么它会将其输出插入HTML ...

<p>Hello your name is:
<script>
  document.write("Somebody");
</script>
</p>

但是，如果您使用document.write 页面加载，那么它将 REPLACE 当前页面，其中包含document.write的输出。有时用于调试或转储大量信息 - 对其他任何内容都没有用。

因此，当代码运行时，您使用document.write 销毁当前页面。不同的浏览器会以不同方式处理不要这样做。

有更好的方法来修改页面。任何内容都包含基础HTML中的表单并隐藏它 - 然后在您需要时显示它。

使用document.createElement和friends在运行中构建数据。

尽管我不喜欢innerHTML，即使也是更好的选择。

TL：DR 很久以前，document.write是与网页交互的唯一方式。在20多年左右的时间里并非如此。不要这样做。假装它不存在。

JavaScript函数在Safari中有效，但在Firefox中找不到

2 个答案: