0

我有一个动态生成的页面(和 div),我需要这个页面做的是在页面加载后立即滚动到特定的 div。这段代码的诡异之处在于......

下面的“按钮”代码,当您在它(或onclick)上运行鼠标时,可以完美运行。它完美地执行了该rolldownTo功能。但是,当我尝试指定指定相同的操作时,window.onload,什么也没有发生。我已经包含了“按钮”代码和window.onload下面的代码。

<html>
<head>
<title>Help</title>

<script LANGUAGE="JavaScript1.2" type="text/javascript" 
    src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"
    djConfig="usePlainJson : true, parseOnLoad: true">
</script>

<script type="text/javascript">
    dojo.require("dojo.parser");
    dojo.require("dijit.form.FilteringSelect");
    dojo.require("dijit.form.TextBox");
    dojo.require("dijit.layout.ContentPane");
    dojo.require("dijit.layout.BorderContainer");
    dojo.require("dijit.layout.TabContainer");
    dojo.require("dojo.data.ItemFileReadStore");
    dojo.require("dojo.window");


function rolldownTo(my_anchor){
    dojo.window.scrollIntoView(my_anchor);
}

window.onload=rolldownTo('car_help');
</script>

<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs    /dojo/1.5/dijit/themes/claro/claro.css"/>
</head>

<body class="claro">

<div dojoType="dijit.layout.BorderContainer" style="width: 100%; height: 100%;">
    <div dojoType="dijit.layout.TabContainer" region="center">
        <div dojoType="dijit.layout.ContentPane" title="CAR HELP" selected=true>
           <button type=button id=button1 onmouseover="rolldownTo('car_help');">
             scroll to car_help
            </button>
            ........
            LOTS OF DIVS LIVE IN THIS DIV, INCLUDING MY TARGET "car_help"
            ........  
 </div>
        <div dojoType="dijit.layout.ContentPane" title="BIKE HELP" selected=false>
     ........
            ........
        </div>
    </div>
</div>
<script language="JavaScript1.2" type="text/javascript">
.... LOTS OF CODE THAT GENERATES CONTENT FOR THE DIVS ABOVE
</script>

</body>

</html>

有谁知道为什么 Javascript 事件喜欢onmouseoveronclick会完美地工作但window.onload不会?

4

2 回答 2

3

你的问题是这一行:

window.onload=rolldownTo('car_help');

您没有将函数分配rolldownToonload事件的回调,而是执行函数并分配返回值,在这种情况下是undefined.

您需要使用匿名函数包装调用以使其工作:

window.onload = function(){ rolldownTo('car_help'); };

现在匿名函数将被onload事件调用,然后调用rolldownTo.

So much for the problem, as NiL has halfway pointed out (onload fires after DOMLoaded) you can use dojo.addOnLoad instead of window.onload here, but you still have to use the anonymous function for the reasons stated above.

于 2011-01-06T22:16:30.510 回答
2

页面加载并不意味着 DOM 树已完全初始化,这意味着除非树完成工作,否则您的脚本无法移动 div,您必须使用 javascript 事件DOMContentLoaded等待它完成。

在 dojo 中,有一个函数可以调用,它会等待浏览器完成 DOM 树,您可以将其用作:

dojo.addOnLoad(function(){rolldownTo('car_help');});

我希望这对你有用

最好的问候

于 2011-01-06T21:45:53.963 回答