jQuery移动应用程序中未显示警报消息 [英] alert message not displayed in jquery mobile application

查看:71
本文介绍了jQuery移动应用程序中未显示警报消息的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是jquery和jquery mobile的新手.我目前正在尝试创建一个简单的移动应用程序,该应用程序在加载页面后会显示警告消息. 根据建议,我在html文件的开头部分添加了以下代码:

I am new to jquery and jquery mobile. I am currently trying to create a simple mobile application that, once a page is loaded, displays an alert message. I have added in the head section of the html file, as suggested, the following code:

<link rel="stylesheet" href="jquery.mobile-1.3.0.min.css" />
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    $('#chart').live('pageinit', function() {
        alert('jQuery Mobile: pageinit for Config page');
    });
</script>
<script type="text/javascript" src="jquery.mobile-1.3.0.min.js"></script>

在主体部分中,我已按预期添加了图表页面的代码:

In the body section I have added, as expected, the code for the chart page:

<div data-role="page" data-theme="b" id="chart">
    <div data-role="header" data-position="fixed">
        <a href="#main-page" data-icon="arrow-r" data-iconpos="left" data-transition="slide" data-direction="reverse">Back</a>
        <h1>Year Chart</h1>
    </div>

    <div data-role="content">
        <div id="container"></div>
    </div>
    <div data-role="footer" data-position="fixed">
        <div data-role="navbar">

        </div>
    </div>
</div>

但是,当图表页面加载到我的计算机(而非电话)的浏览器中时,没有显示警告消息.有人知道问题可能在哪里吗?预先感谢!

However, when the chart page is loaded in the browser of my computer (not the phone), no alert message is displayed. Does anyone know where the problem may lie? Thanks in advance!

推荐答案

这是我可以在所有浏览器(IE,chrome,firefox)中成功发出警报的完整HTML和代码.我猜您的某些JavaScript不存在或有错字.尝试使用CDN.

Here is the full HTML and code that I can success alert in my all browser(IE, chrome, firefox). I guess some of your javascript are not exist or typo. Try to use CDN.

<html>
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
        <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
        <script type="text/javascript">
            $( '#chart' ).live( 'pageinit',function(event){
              alert( 'This page was just enhanced by jQuery Mobile!' );
            });
        </script>
    </head>
    <body>
        <div data-role="page" data-theme="b" id="chart">
            <div data-role="header" data-position="fixed">
                <a href="#main-page" data-icon="arrow-r" data-iconpos="left" data-transition="slide" data-direction="reverse">Back</a>
                <h1>Year Chart</h1>
            </div>
            <div data-role="content">
                <div id="container"></div>
            </div>
            <div data-role="footer" data-position="fixed">
                <div data-role="navbar">
                </div>
            </div>
        </div>
    </body>
</html>

已更新:

如果您使用的是jQuery 1.9+,则应使用.on而不是.live.这是因为.live已从1.9中删除. http://api.jquery.com/live/ 因此,如果您使用的是1.9,则代码应该像这样更改

If you are using jquery 1.9+, we should use .on instead of .live. It is because .live has been removed from 1.9. http://api.jquery.com/live/ So, the code should change like this if you are using 1.9

$( document ).on( 'pageinit','#chart', function(event){
  alert( 'This page was just enhanced by jQuery Mobile!' );
});

这篇关于jQuery移动应用程序中未显示警报消息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆