10

divに基づく特定のポップアップを非表示にするのに問題があります。私がそれらのdivの外側をクリックすると、それらは隠されません。これが私がしているサンプルコードです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script type="text/javascript" src="../JS/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function()
        {
            $("#MainCanvas div").blur(function()
            {
                alert("blured");
            });
        });
    </script>

</head>
<body>
    <div id="MainCanvas" style="width: 400px; height: 350px; border: solid 1px black;">
       <div class="ui-widget-content" style=" vertical-align:middle; height:60px; border: solid 2px black; width:300px;">
            Drag me around
        </div>
    </div>

</body>
</html>
4

8 に答える 8

25

私の記憶が正しければ、A、AREA、BUTTON、INPUT、LABEL、SELECT、TEXTAREAのみがフォーカス/ブラーイベントを作成します。ポップアップの外側をクリックして非表示にする場合は、たとえば、ドキュメントのクリックイベントをリッスンし、イベントがポップアップの内側または外側で発生したかどうかを確認する必要があります。

サンプルコード：

$(document).click(function(e){
    if($(e.target).is('#MainCanvas, #MainCanvas *'))return;
    $('#MainCanvas').hide();
});
于 2009-12-31T12:58:28.350 に答える
6

div blur focusout() の場合は機能します

 $('#divCustomerGroup').focusout(function () {
            alert('yo');
        });
于 2015-10-06T13:22:13.827 に答える
4

tabindexタグに属性を追加できますdiv：

<div class="my_div" tabindex="3"></div>

その後、ぼかしイベントが機能します。

$('.my_div').blur(function(){ 
   //code ... 
});
于 2013-03-06T18:21:45.893 に答える
1

次のコードを使用して実行しました

<script>
    $(document).click(function (e) {
        if ($(e.target).is('._dpcontrol, ._dpcontrol *'))
            return;
        $('._dpcontrol').each(
                function (index, value) {
                    var retrivedtextbox = $(this).find('._dpitem')[0];
                    $(retrivedtextbox).fadeOut();
                });     
    });
</script>
于 2012-06-25T12:05:03.603 に答える
0

最良のアイデアは、mousedownイベントを処理し、イベントを呼び出した要素を確認することです。

于 2009-12-31T13:01:25.040 に答える
0

mouseleaveメソッドとソリューションを使用できます

 <script type="text/javascript">
    $(document).ready(function()
    {
        $("#MainCanvas div").mouseleave(function()
        {
            alert("mouseleave");
        });
    });
</script>
于 2014-10-15T21:00:15.250 に答える
0

簡単にするために、複数のソリューションからヒントを借りました。基本的に何かにフォーカスしたときはそれを表示させたいのですが、クリックして外に出すと再び非表示にしたいのです。したがって、表示された div 内の何かをクリックすると、クリックすると、「DivHoldingcustomController」という親が見つかるかどうかが確認されます。もしそうなら、何もしないでください。そうでない場合 (別の場所をクリックしたため、クリックしたものにはこの親がないため)、カスタム コントローラーを非表示にします。

    $(document).on("click", function (event) {
        var groupSelectorArea = $(event.target).closest(".DivHoldingCustomController").length == 1;
        if (!groupSelectorArea)
            $(".SomethingIWantToHide").hide();
    });
于 2014-04-30T16:42:33.090 に答える
0

jQuery には 、ネイティブの JavaScript ブラー イベントを発生させない要素のブラーおよびフォーカス イベントにバインドするためのメソッド が.focusin()あり ます。jQuery フォーカスアウト.focusout()

于 2014-11-11T10:16:12.263 に答える