close jquery uiダイアログをクリックしたときにダイアログボックスが表示される

Question

このトピックに関連するリンクがいくつかありますが、私の問題は解決していません。私は新しいものを作りました。
まず、ダイアログボックスの外側をクリックすると、純粋なjquery UIダイアログを閉じる必要があります。最初、私はこのコードを使用してダイアログボックスを作成したので：

<div id="login_panel" align=center style="display:none;"> 
    <div id="add_predicts_popup1"> 
     <div id="login_msg" align=center class="messagebox" style="display: none; width: 593px;height: 18px;" ></div> 
     <form name="log_form" id="log_form" method="get"> 
      <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
      <tr><td><h1>Enter Your Username and Password</h1></td><br></tr> 
      <tr><td><input name="txtuser" type="text" class="textpart" id="txtuser" onclick="closeMsg('login_msg')"/></td> 
      <td>&nbsp;</td> 
      </tr> 
      <tr><td><input name="txtpass" type="password" class="textpart" id="txtpass" />&nbsp;&nbsp;</td> 
      <td><input name="btnlog" type="button" class="predict_button2" id="btnlog" value=" " /></td> 
      </tr> 
      <tr> 
      <td class="add_predicts_popup-style_01"><a href="#" onclick="register('register')">Register Now</a> l <a href="#" onclick="register('forgot')">Forget Password?</a></td> 
      </tr> 
      </table> 
     </form> 
    </div> 
</div> 

私が使用し、ダイアログボックスを表示するには、

<script type='text/javascript'> 
$('#log').click(function(){ 
     $('#add_predicts_popup1').dialog({ 
     modal:true, 
     width:608, 
     height:225, 
     title:"Log in" 
     }); 
     }); 
</script> 
<a href=\"#\" id=\"log\">Login</a> 

を

これはうまく働いたと私は

$(window).click(function(event) { 
    if (($(event.target).closest('.ui-dialog')).length>0) { 
     // if clicked on a dialog, do nothing 
     return false; 
    } else { 
     // if clicked outside the dialog, close it 
     $('.ui-dialog-content:visible').dialog('close'); 
    } 
}) 

、のようなボックスを閉じるためのコードを追加しました

この後、ダイアログボックスは表示されません。私はこのコードをdocument.ready内に追加しました。だから誰かがこれで助けてくれる？ありがとう！

Answer 1

イベントソースがボタンでないかどうかを確認します。

$(window).bind('click', function(event) { 
    //.... 
    else if(event.target.id!='log'){ 
     $('.ui-dialog-content:visible').dialog('close'); 
    } 
    //.... 
} 

Answer 2

Seker、

は、私はあなたが最初のクリックのためevent.preventDefault()を使用することをお勧めします。

$('#log').click()イベントで$(window).click()を設定し、一度実行したイベントを削除してください。

あなたに役立つかもしれません。

$('#log').bind('click', function(event){ 
    // The default event is been cancelled 
    event.preventDefault(); 

    $('#add_predicts_popup1').dialog({ 
     modal:true, 
     width:608, 
     height:225, 
     title:"Log in" 
    }); 

    // Adding the click event to close the Dialog. 
    $(window).bind('click', function(event) { 
     if (($(event.target).closest('.ui-dialog')).length>0) { 
      // if clicked on a dialog, do nothing 
      return false; 
     } else { 
      // if clicked outside the dialog, close it 
      $('.ui-dialog-content:visible').dialog('close'); 

      // remove the click of window. 
      $(window).unbind('click'); 
     } 
    }); 
}); 

Answer 3

$('#myBox').dialog({ 
    open: function(event, ui) {      
     $('.ui-widget-overlay').click(function() { 
      $('#stickerBox').dialog('close'); 
     }); 
    } 
});