【问题标题】:Calling a function when page loads页面加载时调用函数
【发布时间】:2012-05-27 09:20:27
【问题描述】:

My code

这是我写的代码。 default 函数应该在页面加载时被调用,而不需要点击任何按钮。它应该显示一些数据,然后应该显示两个按钮。我需要对该代码进行哪些修改?
我是初学者,所以我可能遗漏了很多东西,请帮忙。

这是我的 JavaScript 部分,详细的程序在链接中给出。

function default(){
var i=7;
j=15;
document.write(i+j);
}

【问题讨论】:

  • 何时或在何种情况下应该调用您的default 函数?页面何时加载?一定时间后?或者当其他事件发生时?

标签: javascript function function-call


【解决方案1】:

避免使用关键字

您不能使用关键字default

Uncaught SyntaxError: Unexpected token default 

您需要重命名函数。

立即调用的函数表达式

一旦你这样做了,你可以把它放在括号中立即执行:

(function dflt(){
  var i = 7, j = 15;
  document.write( i + j );
})();

警告:避免document.write

请注意,document.write 将清除您的文档,从而删除您文档的内容。您应该插入一个新的文本节点,或者更新页面上元素的内容:

(function dflt(){
  var i = 7, j = 15;
  document.body.appendChild( document.createTextNode( i + j ) );
})();

您还可以将此文本节点添加到页面上的元素:

var tNode = document.createTextNode( i + j );
document.getElementById("foo").appendChild( tNode );

这会将结果文本添加到id 属性为foo 的任何元素:

<span id="foo"></span>

【讨论】:

  • 当我编写代码时,我没有收到任何错误消息,而是收到一条空白消息。也许你能帮我告诉我应该怎么做才能得到错误消息而不是得到一个空白页?
  • jsfiddle.net/dibyaranjan3177/YLv8G 这个页面有什么问题?调用函数测试时,页面显示加载图标,但没有要加载的项目!
  • @Dibya 你为什么使用document.write?我鼓励您在上面的回答中避免。它只会给你带来不必要的挫败感。
【解决方案2】:

你可以使用Immediately Invoked Function Expression

(function defaults() { // I edited the function name - "default" can not be used
    var i = 7;         // You can also remove the function name, will work either
    j = 15;            // way. "default" is a reserved word
    document.write(i + j);
})();

但它正在调用它……你不能不调用它就运行一个函数,你想用魔法执行它吗?

您应该阅读以下内容:

What does this "(function(){});", a function inside brackets, mean in javascript?


正如@stakx 指出的那样,您可以将函数引用传递给在X 时间后执行函数的函数,例如setTimeout

setTimeout(defaults, 1000); // execute "defaults" after one second.

但这就像自己处理一样:

function foo(aFunction){
    aFunction();
}

foo(defaults);

【讨论】:

  • “不调用函数就无法运行” -- 同意,除非涉及定时器或事件。
  • jsfiddle.net/dibyaranjan3177/3pNWe/1 我已经编辑过了。问题是它没有显示按钮。
  • 是的!自调用匿名函数:)
  • 你也可以去掉函数名defaults
  • +1 用于指向这个东西的名字:“立即调用函数表达式”
【解决方案3】:

如果您不打算使用 jQuery(如 @Photon 严重致命错误所建议的那样),您可以试试 body element's onload event

<body onload="default();">
    ...
</body>

虽然这可能无法按预期工作。 jQuery 以更可靠的方式处理此问题,因此,如果您决定尝试一下,请查看 $(document).ready(…) API 函数。

【讨论】:

  • 我觉得他/她不知道jquery的可靠性和灵活性。
  • @Photon,同意,但那又怎样?这只是一个建议。如果 OP 不想使用它,还有onload 事件。
  • 但他们也不想打电话?
【解决方案4】:
function default(){
    var i=7;
    j=15;
    document.write(i+j);
    }

default 是 javascript 中的保留字,您不能使用它。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-03-21
    相关资源
    最近更新 更多