我如何防止jQuery移动弹出关闭时，点击一个链接

Question

我正在尝试使用:target伪选择器将jQuery移动弹出窗口与链接结合在一起。

它在理论上工作得很好(click element, hashChanges, change CSS using :target)，但无论是点击还是(更有可能)hashChange也关闭了弹出窗口。

这是一个快速的弹出窗口的例子，点击时翻转。

/* =========================== FLIP popup ========================= */
.ui-popup .card_register {
  display:none;
}
#access-popup:target .card_login {
  display:none;
}
#access-popup:target .card_register {
  display:block;
}
@media screen an
  (min-device-pixel-ratio: 0) {
  .ui-popup-container {
    perspective: 800;
  }
  #access-popup:target .ui-popup {
    transform: rotateY(180deg);
  }
  .ui-popup {
    transition: transform 0.6s ease-in-out;
    transform-style: preserve-3d;
  }
  .card_login, .card_register {
    backface-visibility: hidden;
  }
  .card_register {
    position: relative;
    transform: rotateY(180deg);
  }
  #access-popup:target .card_register,
  #access-popup:target .card_login {
    display:block;
  }
}
.ui-popup-container {
  max-height: 400px;
}
.ui-popup {
  position: relative;
  background: white;
}
.card_login, .card_register {
  box-sizing: border-box;
}
.card_login {
  height: 400px;
}
.card_register {
  bottom: 400px;
  float: left;
}

和HTML:

  <a href="#access" data-transition="pop" data-rel="popup">Open</a>
  <div data-role="popup" id="access">
      <div class="card_login">
        <a href="#access-popup" rel="external">Register</a>
      </div>
      <div class="card_register">
        <a href="#&ui-state=dialog" rel="external">Login</a>
      </div>
  </div>

翻转过渡和后退工作对:hover，但当我尝试使用:target选择器，每次我点击链接，弹出关闭。

问题:
我知道我可以绑定到popupbeforeclose和preventDefault，但我想知道，如果有一个默认的方式来防止从关闭弹出框内的链接点击?我已经尝试了data-dismissable="false"并在链接上设置rel="external"。

感谢输入!

Answer 1

有一个更好的答案，这似乎是防止弹出窗口关闭的"侵入性最小"的JQM方法:

  $(window).on('navigate', function(e, data) {
    e.preventDefault();
  });

仍然需要调整何时真正preventDefault，何时让事件通过。

Answer 2

添加像这样的onclick功能对我来说很有效:

onclick="return !window.open(this.href)"