如何在加载页面中执行JavaScript

How to execute JavaScript in page that when loaded?

本文关键字:执行 JavaScript 加载      更新时间:2023-09-26

我使用jQuery Mobile。但是当我在另一个html文件中加载页面作为页面时,head标签中的javascript将不会执行。我检查了来源,发现头部标签仍然是原来的。那么,当页面加载时,我应该怎么做才能运行脚本呢?

EDIT1:

我也试图在body标签内编写js代码,但脚本不会在离开时停止。我有一个计时器,所以会有两个计时器比赛。

EDIT2:

我已经上传了页面:

main.htmlhttp://pastebin.com/0Y9Xfrtw

recharge.htmlhttp://pastebin.com/j9HfUvqZ

recharge.jshttp://pastebin.com/K5eCwMAb

UPDATE #2:

  • http://jsfiddle.net/QgSaw/9/

尝试在页面转换之前停止计时器。由于您正在使用多个页面,我不确定计时器在其他地方导航时停止。试着测试不同的页面过渡事件:

  • http://jquerymobile.com/demos/1.0rc2/docs/api/events.html

在上面的例子中我使用了:

pagebeforehide
更新:

我已经尝试将您的代码从PasteBin添加到JSFiddle

  • http://jsfiddle.net/QgSaw/3/

我认为这是工作,因为我看到计时器倒计时在充值页面,如果它达到零导航回到主页:

  • http://jsfiddle.net/QgSaw/4/(与定时器js,但它应该在它自己的文件)

我在这个方法上得到一个错误:

Uncaught TypeError: Object [Object Object] has no method 'everyTime'

替代everyTime

  • jquery"everyTime"函数
使用jQM的

,所有JavaScript(对于每个页面)应该在首先加载的页面中。所以如果你加载index.html,把所有JavaScript放到这个页面。要执行特定页面的JavaScript,您可以使用page初始化事件之一,Docs:

  • http://jquerymobile.com/demos/1.0rc2/docs/api/events.html

JS

$('#page_id').live( 'pageshow',function(event, ui){
    alert( 'This page was just hidden: '+ ui.prevPage);
});

的例子:

  • http://jsfiddle.net/QgSaw/

JS

$('#home').live( 'pageshow',function(event, ui){
    alert( 'We are back home');
});
$('#page2').live( 'pageshow',function(event, ui){
    alert( 'This will only execute on Page 2');
});
HTML

<div data-role="page" id="home">
    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">Overview</li>
            <li><a href="#page2">Page 2</a></li>
        </ul>
    </div>
</div>
<div data-role="page" id="page2">
    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">Overview</li>
            <li><a href="#home">Go Back Home</a></li>
        </ul>
    </div>
</div>