无法获取要执行的JQuery-Mobile可折叠展开/折叠事件 [英] Unable to get JQuery-Mobile collapsible expand/collapse event to execute

查看:78
本文介绍了无法获取要执行的JQuery-Mobile可折叠展开/折叠事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我要使用JQuery-Mobile可折叠的展开/折叠事件绑定以下演示HTML文件,但无法触发JavaScript事件.我在这里以JSFiddle示例为基础: http://jsfiddle.net/6txWy/

I have the following demo HTML file that I am tying to use the JQuery-Mobile collapsible expand/collapse events and I am not able to get the JavaScript event to fire. I am basing this off the JSFiddle example here: http://jsfiddle.net/6txWy/

我觉得我只是在忽略一些简单的东西,但这是我的HTML文件:

I feel like I am just overlooking something simple but here is my HTML file:

<html> 
<head> 
  <title>References</title>

  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
  <link rel="stylesheet" href="css/main.css" />

  <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
  <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>  

  <script type="text/javascript">
  $('#my-collaspible').bind('expand', function()
  {
    alert('Expanded');
  }).bind('collapse', function () {
    alert('Collapsed');
  });
  </script>
</head> 

<body>
  <div data-role="page">
      <div data-role="content">
          <div data-role="collapsible" id="my-collaspible">
              <h3>My Title</h3>
              <p>My Body</p>
          </div>
      </div>
  </div>
</body>
</html>

折叠和展开工作,但警报从未触发.

The collapse and expand work but the alerts are never fired.

谢谢! 跳蚤

推荐答案

添加

Add a PageInit call to make sure the page is loaded before binding the events

示例:

代码:

$('#home').live('pageinit', function(event) {
    $('#my-collaspible').bind('expand', function() {
        alert('Expanded');
    }).bind('collapse', function() {
        alert('Collapsed');
    });
});

这篇关于无法获取要执行的JQuery-Mobile可折叠展开/折叠事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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