未调用 JS 函数

JS function not being called?

本文关键字:函数 JS 调用      更新时间:2023-09-26

我是javascript的一个完整的菜鸟,所以如果有人可以帮助我,我会欣赏它:)

我试图从我的外部 js 文件调用我的函数(问题),但它没有加载它,无论出于何种原因,任何帮助都会很棒!

网页文件

 <section>
    <h3 id="q1" window.onload= "loadQuestion1()" style="color:blue"></h3>
    <ul>
        <li><input type="radio" id="answerswers" value="Css is 1" >Answer 1</li>
        <li><input type="radio">Answer 2</li>
        <li><input type="radio">Answer 3</li>
        <li><input type="radio">Answer 4</li>
    </ul>
    </section>
</div>
<footer>
</footer>
<script type="text/javascript" src="js/quiz.js"></script>
</body>

JavaScript 文件

console.log("53");
var questions = Array["question 1", "question 2", "question 3","question 4" ]
function loadQuestion1(){
console.log("q1");
document.getElementById('q1').innerHTML = "text";
}
function rand(min, max) { 
var offset = min; 
var range = (max - min) + 1; 
var randomNumber = Math.floor( Math.random() * range) + offset; 
return randomNumber; } 
randomNumber = rand(0, questions.length - 1); 
randomQuestions = questions.[randomNumber];

所以目前它应该加载"文本"这个词,但由于某种原因它没有加载它 - 别介意实际问题。

p.s 我试图制作一个小的测验应用程序,从数组中选择一个随机问题

window.onload是一个JavaScript属性,而不是HTML属性。

HTML 属性中没有.

HTML 中没有 window 属性。

h3元素没有onload属性(因为它不会触发任何内容的加载)。

如果你在 90 年代编写代码,你会:

<body onload="loadQuestion1()">

00 年代的代码通常使用:

window.onload = loadQuestion1;

这十年的代码通常使用:

addEventListener('load', loadQuestion1);

只需将您的JS放入其中:

window.onload = function(){
    /*YOUR JS HERE*/
}

window.onload 事件在文档窗口准备就绪时启动

你应该从 h3 标签中删除代码 window.onload= "loadQuestion1()",并将 onload= "loadQuestion1()" 添加到 body 标签中。

这应该有效。

这是工作代码,您在JS中也有一些语法错误,请与您的代码进行比较

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body onload="loadQuestion1()">
<section>
    <h3 id="q1" style="color:blue"></h3>
    <ul>
        <li><input type="radio" id="answerswers" value="Css is 1">Answer 1</li>
        <li><input type="radio">Answer 2</li>
        <li><input type="radio">Answer 3</li>
        <li><input type="radio">Answer 4</li>
    </ul>
</section>
<footer>
</footer>
<script type="text/javascript">
    console.log("53");
    var questions = Array["question 1", "question 2", "question 3", "question 4" ];
    function loadQuestion1() {
        console.log("q1");
        document.getElementById('q1').innerHTML = "text";
    }
    function rand(min, max) {
        var offset = min;
        var range = (max - min) + 1;
        var randomNumber = Math.floor(Math.random() * range) + offset;
        return randomNumber;
    }
    randomNumber = rand(0, questions.length - 1);
    randomQuestions = questions[randomNumber];
</script>
</body>
</html>