0

閉じるボタンの簡単な解決策が必要なダイアログがたくさんあります。それぞれを閉じるために大量のコードを書きたくありません。

ダイアログを閉じたいすべてのボタンとリンクに class="btnDone" を使用したいと思います。各ダイアログの各ボタンのインスタンスごとに個別の関数を記述する以外に、これを行う簡単な方法はありますか?

ダイアログ コードの 1 つの例を次に示します。

    <script>
    // increase the default animation speed to exaggerate the effect
    $.fx.speeds._default = 1000;
    $(function() {
        $( "#forgotPassword" ).dialog({position:['middle',60],
            open: function(event, ui) {  
            jQuery('.ui-dialog-titlebar-close').removeClass("ui-dialog-titlebar-close").html('<span style="float:right;"><img src="../images/x.png" /></span>');  
        },  
            dialogClass: 'ui-widget-shadow',
            modal: true,    
            autoOpen: false,
            width: '650px',
            close: function(ev, ui) {$(this).close();}
        });

        $( ".forgotPasswordOpen" ).click(function() {
            $( "#forgotPassword" ).dialog( "open" );
            return false;
        });
    });
    </script>
<div style="display:none">
    <div id="forgotPassword">
        <!--#include file="modal08.asp"-->
    </div>
</div>

class="btnDone" を使用して close 関数を作成するにはどうすればよいですか?

4

3 に答える 3

5

APIを見ましたか？それはちょうど1つを開くようなものです

$( ".btnDone" ).click(function(){
  $('.ui-dialog-content').dialog( "close" );
})
于 2013-01-11T15:50:51.993 に答える
1

すべてのダイアログを閉じるマスター ボタンを使用しようとしていると思います。各ダイアログに次の.btnDoneようなスタイルのボタンが含まれている場合:

<div>
My great dialog
<button class="btnDone">Get outta here</button>
</div>

<div>
Another thought
<button class="btnDone">Close</button>
</div>

<div>
Check this out
<button class="btnDone">Away!</button>
</div>

を使用して、すべてのダイアログ$('.btnDone').parent('div').dialog('close');を閉じるか非表示にすることができます。$('.btnDone').parent('div').hide();

実際の例については、 http://jsfiddle.net/jhfrench/PHcL4/1/を参照してください。

于 2013-01-11T15:50:30.337 に答える
1 
<script>
   $( ".btnDone" ).click(function() {
       $(this).parent().dialog( "close" );
   });
</script>
<div id="forgotPassword">
   <input type="button" class="btnDone" value="Done" />
</div>
<div id="forgotUsername">
   <input type="button" class="btnDone" value="Done" />
</div>

ボタンがダイアログ内にあると仮定すると、ボタンの .parent() を呼び出してその特定のダイアログを参照するだけです。

ただし、これまでjQuery UIを使用したことがないため、ダイアログを閉じるために「閉じる」を渡すかどうかはわかりません。

于 2013-01-11T15:51:32.350 に答える