两个在页面加载时运行的函数

Two functions running at page load

本文关键字：加载 运行 函数 两个      更新时间：2023-09-26

我试图在一个文件中合并两个函数。结果将在加载页面以运行函数时出现，结果将出现在定义的div上。如果有人能告诉我我做错了什么，我会非常感激。

function Calc(){
  var a;
  var b;
  var c;
  
  a=1;
  b=2;
  
  c=a+b;
  
  $("#FirstDiv").html(c);
}
function Name(){
   var Name;
   Name = "George";
  
  $("#SecondDiv").html(Name);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="FirstDiv"></div>
<div id="SecondDiv"></div>

你需要在页面加载时像这样执行你的函数:

function Calc(){
  var a;
  var b;
  var c;
  
  a=1;
  b=2;
  
  c=a+b;
  
  $("#FirstDiv").html(c);
}
function Name(){
   var Name;
   Name = "George";
  
  $("#SecondDiv").html(Name);
}
Calc();
Name();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="FirstDiv"></div>
<div id="SecondDiv"></div>

如果你正在使用jQUery，使用这个函数来安全地执行你的两个函数。

<script>
$( document ).ready(function() {
    //call your functions here;
});
</script>
https://learn.jquery.com/using-jquery-core/document-ready/

正如其他人告诉你的那样，问题是你没有调用函数。

但是考虑将每个函数转换为IIFE，这样可以防止全局作用域污染(即将函数附加到窗口或文档作用域)，并在脚本解析后立即执行函数。

事情将是这样的:

(function Calc($){
    var a;
    var b;
    var c;
   a=1;
   b=2;
   c=a+b;
  $("#FirstDiv").html(c);
})(jQuery)
(function Name($){
   var Name;
   Name = "George";
  $("#SecondDiv").html(Name);
})(jQuery)

如果你把jQuery传递给IIFE，你可以确定$指向jQuery而不是其他库或其他东西。

编辑:

作为@MisterPositive注释，请确保jQuery已经加载。所以，是的，包装你的代码在$(document).ready(function(){})或添加jQuery脚本标签在标题和你的脚本关闭</body>标签(另一种方式来确保页面加载之前执行你的代码)

希望有帮助!

相关文章：