0

我正在开发一个 RhoMobile 应用程序，我在页面转换方面遇到了很多麻烦。

最后，我只是决定关闭它们以获得更好的用户体验。除了我在可折叠元素内有一个按钮的情况外，每次单击按钮都可以正常工作。为了不将按钮上的点击事件解释为对可折叠的点击，我使用了这个 js 代码，我怀疑这会造成麻烦：

 $(document).on('pagebeforeshow', '#index',function(e){ 
   $('.details').bind('click', function (e) {      
     e.stopPropagation();
     e.stopImmediatePropagation();
   });
 });

在 HTML 中：

<div data-role="page" id="index">
Here go headers & navbar and other stuff
</div>
<div data-role="content">
   <div data-role="collapsible-set" class="uurbon-block">
    <div data-role="collapsible" data-collapsed="false">
      <h3 data-position="inline"><p class='alignleft'>Collapsible title</p><div style="clear: both;"></div>        
        <span style="float:right;" class="button-span">
            <a href="some_url.html" data-role="button" data-mini="true" data-inline='true' data-icon="star" data-iconpos="left" class="details" data-transition="none">
              Button
            </a>     
        </span>  
      </h3>
    </div>
  </div>
</div>

这将导致空白页在转换前显示 1-2 秒。我正在寻找解决方案，但如果没有，我会很高兴该页面只是变黑（我的应用程序背景也是黑色的，所以这个闪烁不会那么明显）。注意：我已经尝试在 css 中设置正文背景颜色，但不起作用。谢谢你的想法！

4

1 回答 1

0

正如 Omar 所指出的，如果您想将一个按钮放在可折叠的内容中并防止可折叠的内容在同一浏览器中处理页面的同时捕获点击，正确的方法是（请注意，这可能仅适用于 RhoMobile ，但值得一试其他基于 jquerymobile 的框架）：并避免 RhoMobile 尝试在新浏览器中打开它，方法是使用：

javascript:

$(document).on('pagebeforeshow', '#index',function(e){ 
    $('.details').bind('click', function (e) {
            e.stopPropagation();
            $.mobile.changePage("your_page");
    });
});

HTML：按钮

注意 href="javascript:;"。我首先将它设置为“#”和“”，但这不起作用。

于 2013-11-15T08:17:28.823 回答