Onload 函数不是触发函数，没有控制台错误

编程问答 2022-05-18

问题描述

我正在尝试制作一个 JavaScript 公告，在这种情况下，它包含一个函数 main()，它不会在我插入的 body 标签中的 onload 函数时触发，但是当我在 Chrome 的控制台中手动触发这个函数时，它按预期工作，请帮助我.. 我还使用 Firebase 的实时数据库作为我将从那里使用的更多值中的一个值。 代码： Here is the HTML & JS

或者你可以看到代码：
HTML：

// Firebase Setup
// Your web app's Firebase configuration
  // For Firebase JS SDK v7.20.0 and later,measurementId is optional
  var firebaseConfig = {
    apiKey: "AIzaSyBz2pk-ec0yn7H25fzLaXI13CmAX4xp1-o",authDomain: "learningdb-1.firebaseapp.com",databaseURL: "https://learningdb-1-default-rtdb.firebaseio.com",projectId: "learningdb-1",storageBucket: "learningdb-1.appspot.com",messagingSenderId: "287578856127",appId: "1:287578856127:web:0894a806aa5b039bafc40a",measurementId: "G-682XPG49J1"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  // Add .child('the reference of the value you want to see like dbRef.on')
  var dbRef = firebase.database().ref();
  let announcements;
  var ann = firebase.database().ref().child('announcements');
  ann.on('value',snap => announcements = snap.val());
// /Firebase Setup and Inialization Complete!
// announcements = true;
function main() {
    if (announcements == true) {
        mainAnnouncement = "AVMC has decided to recontinue the minecraft Network services           and is expected to be up by 20-25 march. This given date may be                 extended seeing the amount of potential problems in the Network as              of being down for a good time. There will be tests done with some               feature updates and more before going up! ";
        announcementTitle = "Important Notice! ";
        jsPara = document.getElementById('jsId');
        jsPara2 = document.getElementById('jsPara')
        jsPara.innerHTML += `Announcements is set to "${announcements}" <br> 
        <b> [ANNOUNCEMENT BODY] </b> <br>`;
        jsPara2.innerHTML += 
        `<div class="alert alert-warning" role="alert">
        <h5>
        <b>${announcementTitle}</b>
        </h5>
        <hr>
        ${mainAnnouncement}
        </div>`
} else if (announcements == false) {
    jsPara = document.getElementById('jsId');
    jsPara.innerHTML = `Announcements is set to "${announcements}"`;
}
}
<!DOCTYPE html>
<html>
<head>
    <title>LearningDB-1 | AVMC</title>
    <script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-database.js"></script>
    <script src="js/index.js"></script>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
</head>
<body onload="main()">
<br>
<div class="container">

<h4><u><b>This code triggers an Announcement 
when the value "announcement" is set to "true"</u></b></h4>

<h5 id="jsId"><b> [ANNOUNCEMENT] </b></h5>
<div id="jsPara"></div>
</body>
</script>
</html>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

bootstrap-5firebasefirebasefirebasehtmljavascript