jqueryモデル（BlockUI）に閉じるボタンを追加

Question

正しく動作する以下を使用しましたが、自動的に閉じる方法ではなく閉じるボタンが必要ですか？

$(document).ready(function() { 
    $('#app').click(function() { 
     $.blockUI({ 
      theme:  true, 
      title: 'Welcome to your page', 
      message: '<p>Please have a look..</p>', 
      timeout: 2000 
     }); 
    });  
}); 

Answer 1

チェックアウトthis（私はjQueryのBlockUI http://www.malsup.com/jquery/block/#demosを使用しています）。

アイデアは、カスタムダイアログを表示し、$ .unblockUI（）;を呼び出すことです。ユーザーが「いいえ」ボタンをクリックしたとき。

Answer 2

まだ興味があるかどうかはわかりませんが、探していて見つからなかったので、自分で解決策を作成する必要がありました。あなたがが（jquery.blockUI.js）のプラグインを更新する必要があり、このラインに行く：

if (opts.title) { 
    s += '<div class="ui-widget-header ui-dialog-titlebar ui-corner-all blockTitle">'+(opts.title || '&nbsp;')+'</div>'; 

し、このものと交換してください：

if (opts.title) { 
    s += '<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"><span id="ui-id-1" class="ui-dialog-title">' +(opts.title || '&nbsp;')+ '</span><button id="btnCloseBlockUI" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" role="button" aria-disabled="false" title="close"><span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span><span class="ui-button-text">close</span></button></div>'; 

これはタイトルにボタンを追加しますバー。ボタンのクリックハンドラを追加するには：

//Unblocks the UI when clicking the close button 
$("button#btnCloseBlockUI.ui-button").click(function() { 
    $.unblockUI(); 
}); 

をあなたはもっと派手なことや余分なオプションを追加し、showCloseButtonUIのようなもの、それがtrueに設定されていた場合にのみ、それを表示することができます。