web2.0ポップアップ？

Question

必要なサイトでは、ユーザーがリンクをクリックしたときに外部のWebサイトに移動するためのチェックが必要です（理由は聞かないでください。）

クライアントは、ある種のポップアップボックスを必要とします。このポップアップボックスには、<！> quot;本当に行きますか？<！> quot;はいまたはいいえの2つのボタンとともに。

これで、これまですべてクラシックブラウザーのポップアップでこれを実行しました。JSがオフになっている場合、プランのahrefリンクをそのままにしておくと、本当に優雅に低下します。私の質問は...これを行う別の方法がありますか？これは普通のくだらないポップアップよりも少しファンキーです？

シックボックスといくつかの JQueryスライダーが、Javascriptを無効にするとすぐに

a）<！> quot; popup <！> quot;はありません。 b）リンクでさえ、機能しなくなった<！> quot; popup <！> quot;

をアクティブにするために必要なマークアップのおかげで、それが行くべき場所を指し示しなくなった

アイデアや考えはありますか？ ：P

Answer 1

答えはthickboxを使用することでした：

<a href="http://www.whatever.com" onclick="tb_show('Warning', 'ajax.html?height=300&width=440', 'thickbox');return false">

その後、ajax.html（またはその他）を取得して表示できます。ボタンを使用してシックボックスを閉じる場合は、次を追加します。

<a href="#" onclick="tb_remove()">

Answer 2

あなたがすべきことは次のようなものです：

$("a.outside").click(function (){
  openPopupWithThickbox();
  var result = getResultFromThickbox();
  return result;
});

これにより、ユーザーが[いいえ]をクリックするとリンクはアクティブになりませんが、ユーザーがサイトを離れたい場合は機能します。

もちろん、同様に適切に劣化します。

Answer 3

利用可能な多くのオプションがある場合、jQuery UIのダイアログコンポーネントを選択します。

Answer 4

jQueryを使用してページでこれを行うリクエストがあり、これを思いつきました：

jQuery( function () {
  jQuery( '#warn-dialog' )
    .dialog({
      autoOpen: false,
      modal: true,
      buttons : { 
        'Yes' : function () { 
          document.location.href = jQuery( '#email-link' ).attr( 'href' );
        },
        'No' : function () { 
          jQuery( '#warn-dialog' ).dialog( 'close' ); 
        }
      }
    });
  jQuery( '.warn-link' ).click( function ( event ) {
    event.preventDefault();
    jQuery( '#warn-dialog' ).dialog( 'open' );
  });
});

次のようなHTMLを使用：

<div id="warn-dialog" class="ui-helper-hidden" title="Warning">
  <p>Are you sure you want to leave?</p>
</div>

<p>
  <a class="warn-link" href="http://link1.com">link1</a>
  <a class="warn-link" href="http://link2.com">link2</a>
</p>