在做项目时,需要在页面加载完后初始化一些数据,比如下拉框中的数据,我使用的是window.onload方法,因为要加载两个函数,所以刚开始是这样写的(其中A、B是函数名):
window.onload = function(){A();B();}
但是运行后发现页面只初始化了一个下拉框数据,也就是说只执行了其中的一个方法,很是郁闷,在网上查了下原因,才知道原来不能通过onload方法调用多个函数,如果确实要实现这样的功能,则要加如下的一个函数:
function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { oldonload(); func(); } } }
然后多次调用这个函数就可以了。
本以为这样会万事大吉,没想到还是遇到一个很不解的问题:
当我把addLoadEvent(func)函数和A()、B()函数一起写在一个js文件中,然后在jsp里调用,结果还是只执行了一个函数;
而当我把addLoadEvent(func)函数从js文件挪到要使用它的jsp页面后,奇迹出现了,该加载的数据都加载上了。
虽然问题解决了,但是不太明白为啥会这样?
相关推荐
- 这种设计可以确保多次调用 `addLoadEvent` 时,所有的回调函数都能按照顺序正确执行。 ##### 2.3 应用场景 - **页面初始化**:可以在页面完全加载后再进行DOM元素的操作,避免因为元素未加载完成而导致的错误。...
当需要一个事件触发时执行多个函数,单纯地使用`window.onload`或元素的`onclick`等事件处理方式可能会遇到问题,特别是在需要同时处理多个事件处理器时。这时,`window.attachEvent`和`window.addEventListener`就...
然而,如果试图将多个函数绑定到同一个`onload`事件处理函数,会遇到问题,因为每个事件处理函数只能关联一个函数。 例如,如果我们有`firstFunction()`和`secondFunction()`两个函数,我们可能会尝试像下面这样...
### window.open()函数详解 在Web开发中,`window.open()`是一个非常实用的JavaScript函数,用于在新的浏览器窗口或标签页中打开一个指定的URL。它不仅能够打开新窗口,还可以控制新窗口的属性,如大小、位置以及...
你可以将`window.open()` 包装在一个函数中,然后在需要的时候调用。比如: ```html <!-- function openwin() { window.open("page.html", "newwindow", "height=100, width=400, toolbar=no, menubar=no, ...
这种方法可以在页面加载完成后执行多个函数。 JQ 方法 如果我们使用 jQuery 库,那么可以使用 `$(document).ready()` 事件来自动执行 JS 函数。例如: ```javascript $(document).ready(function() { $("table tr...
在某些场景下,可能需要同时打开多个窗口,只需要在一个函数中多次调用 `window.open` 方法即可。例如: ```javascript <!-- function openwin() { window.open("page.html", "newwindow", "height=100,width=...
如果需要在页面加载完毕后执行多个操作,则必须在一个函数内组织这些操作,或者使用某些框架提供的方法将多个函数合并起来。 当然,随着前端技术的发展,为了提升页面加载性能,特别是在有多个脚本或大型应用时,...
#### 示例 3: 同时打开多个窗口 ```javascript function openwin() { window.open("page.html", "newwindow", "height=100,width=100,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,...
1. 在HTML中,`<body onload="fn1(),fn2()">`允许同时调用多个函数,但这种方法已过时,且不推荐,因为它与JavaScript分离,不利于代码组织。 2. 使用`$(window).load()`,我们可以像这样添加多个事件处理程序,每个...
4. **代码复用性**:封装后的函数可以在多个地方重复使用,提高了代码的复用性。 #### 六、案例对比 以下是一个简单的案例对比,以帮助理解这两种不同的实现方式: **使用自执行函数和伪命名空间**: ```...
由于页面加载完成后只执行一次onload事件,所以当需要在页面加载完成后执行多个函数时,就要特别注意避免覆盖已有的onload事件处理函数。可以通过以下方式动态地添加多个函数: ```javascript function ...
然而,由于`window.onload` 只能绑定一个函数,所以在多个脚本或库需要在这个事件上执行操作时,可能会产生冲突。 为了解决这个问题,我们可以使用“追加函数”技术,即不覆盖原有的`window.onload` 事件,而是将其...
1. **内容聚合**:将多个页面的内容整合到一个页面中,提高用户体验,例如,新闻网站的多个栏目可以放在一个页面里。 2. **视频播放**:许多视频平台使用`IFrame`嵌入视频播放器,如YouTube、Vimeo等。 3. **隐私...
然而,当有多个函数需要在页面加载完成后执行时,直接将它们都绑定到`onload`事件可能会导致问题,因为`onload`事件只能处理一个函数。为了解决这个问题,我们可以使用一种技术叫做“事件监听器的封装”,这里以`...
window.open() 是 JavaScript 中的一个函数,用于打开新的浏览器窗口或标签页。在实际开发中,我们经常需要对新打开的窗口进行自定义设置,如设置窗口的尺寸、位置、工具栏、菜单栏等。本文将详细介绍 window.open()...
当我们在同一个页面中同时使用 `body.onload` 和 `window.onload` 时,可能会遇到以下问题: 1. **事件覆盖**:如果两个事件处理函数被分别指定,那么后定义的函数会覆盖前一个,导致前面的函数不再执行。 2. **...