代码之家  ›  专栏  ›  技术社区  ›  Klyner

jquery移动弹出窗口不总是在按下相关按钮时出现。

  •  0
  • Klyner  · 技术社区  · 7 年前

    在我的移动应用程序中,我旁边有两个与同一弹出窗口相关的按钮。

    点击后 first 按钮,弹出窗口将打开一条消息(数据代码属性)。然后,单击 second 按钮(要关闭弹出窗口),单击该按钮后,弹出窗口将不再打开(带有另一条消息)。 第二 再次按下按钮。按钮看起来像是被选中的,只有当用户将焦点从按钮上取下然后再次按下按钮时,弹出窗口才会再次打开。

    它在您关闭弹出窗口而不单击 第二 按钮。

    我的按钮具有以下属性:

    role = null;
    icon = 'grid';
    rel = 'popup';
    

    单击按钮后,HTML将更改:

    $( this.selector ).off( "tap" ).on( "tap", ".ui-icon-grid", function() {
        $( "#popup" ).html( $( this ).attr( "data-code" ) );
    } );
    

    此问题仅在移动设备上发生。

    在上测试了此问题 https://api.jquerymobile.com/popup/ 通过复制 Open Popup 按钮,有时也会出现同样的问题。(在我的移动设备上)

    我应该使用多个弹出窗口而不是将所有按钮关联到一个弹出窗口吗?

    1 回复  |  直到 7 年前
        1
  •  0
  •   Klyner    7 年前

    目前,我阻止了默认的jquery移动事件的发生,并从那里接管它。这样可以防止奇怪的行为发生。更好的解决方案仍然受到欢迎。

    event.preventDefault();
    var $popup = $( "#popoup" );
    var $button = $( this );
    var buttonOffset= $button.offset();
    var buttonCenterY = buttonOffset.top + ( $button.height() / 2 );
    var buttonCenterX = buttonOffset.left + ( $button.width() / 2 );
    $popup.html( $button.attr( "data-code" ) );
    $popup.popup( "open", { x: buttonCenterX, y: buttonCenterY } );
    
    推荐文章