1

開発中のサイトで jQuery UI 1.8.19 と Twitter Bootstrap 2.0.3 を使用しています。削除をクリックしたときにモーダル ダイアログを表示したいので、次のようにします。

 <div id="dialog-confirm" title="<?php echo lang("event:delete_confirm_title") ?>">
      <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span><?php echo lang('event:delete_confirm_content') ?></p>
 </div>

イベントを発生させる JS は次のとおりです。

 $(function() {
    $("#delete").click(function(){
        $( "#dialog-confirm" ).dialog({
            resizable: false,
            height:140,
            modal: true,
            buttons: {
                "<?php echo lang('event:delete') ?>": function() {
                    $( this ).dialog( "close" );
                },
                "<?php echo lang('global:cancel_label') ?>": function() {
                    $( this ).dialog( "close" );
                }
            }
        });
    });
});

何らかの理由で、ページの最後にモーダル ダイアログが常に表示されるべきではないと思いますが、要素をクリックするとダイアログが表示されますが、ページは即座にホームページにリダイレクトされ、原因がわかりませんでした。どこにもリダイレクトがなく、フォームもありません。これに関するアドバイスやヘルプはありますか？よろしくお願いします

4

2 に答える 2

2

style='display: none'起動時に表示されないように、ダイアログ div に追加する必要があります。

次に、ボタンをクリックしたときにページがホームに送信される場合、#delete ボタンのタイプを確認しreturn false、通常のクリック イベント ハンドラーが起動されるのを避けるために、たとえば送信の場合は機能を終了することができます。

$(function() {
    $("#delete").click(function(e){
        $( "#dialog-confirm" ).dialog({
            resizable: false,
            height:140,
            modal: true,
            buttons: {
                "<?php echo lang('event:delete') ?>": function() {
                    $( this ).dialog( "close" );
                },
                "<?php echo lang('global:cancel_label') ?>": function() {
                    $( this ).dialog( "close" );
                }
            }
        });
    e.preventDefault();
    });
});

編集：スコットの提案に従って行われた変更

于 2012-04-25T12:38:45.743 に答える
1

これは私にも起こりました。私が知っている原因はただ一つ。ダイアログ CSS ファイルがロードされていません。

SO の質問を参照してください: position:fixed breaks in IE9

于 2012-04-25T12:34:40.073 に答える