Question

这是html代码

<a class="button_example" onclick="funshow()" onblur="hide()">login</a>

这是jquery代码

function funshow() {
        $(".logbox").toggle();

    }

 function hide() {            
        $(".logbox").toggle();
    }

当我点击超链接时显示div 但当我点击身体的另一部分时，它不会隐藏.. 所以我怎么能隐藏模糊的div 请帮忙。

Answer 1

试试这个，

function funshow() {
    $(".logbox").show();
}

function hide() {            
    $(".logbox").hide();
}

或者尝试一下，

<强> HTML

<a class="button_example" href="#">login</a>

<强> SCRIPT

$('.button_example').on({
     'click': function () {
         $(".logbox").show();
     },
     'blur': function () {
         $(".logbox").hide();
     }
});

Demo

Answer 2

您可以尝试使用此代码。

  $('.button_example').on({
     'click': function () {
     $(".logbox").show();
 }
});
$(document).mouseup(function (e)
{
    var container = $(".logbox");

    if (!container.is(e.target) // if the target of the click isn't the container...
    && container.has(e.target).length === 0) // ... nor a descendant of the container
    {
        container.hide();
    }
});

Answer 3

上述场景中的问题是onfocus和onblur事件不适用于链接
1.您可以使用onmouseout事件而不是模糊来隐藏.logbox但如果鼠标不在链接上则会隐藏它或
2.如果您没有使用超链接将用户重定向到任何其他页面，则使用按钮并应用css以使其看起来像链接

<button onclick="funshow()" onblur="hide()">login</button>

Answer 4

<a class="button_example">login</a>
<div class="logbox">gfsdfgfd</div>

$(document).ready(function(){
                 $('.button_example').click(function() {
                       $(".logbox").toggle();
                       });

               });

在超链接的模糊事件上隐藏div

4 个答案: