JQUERY：如果用户在其外部点击，则关闭div-Java 学习之路

我有一个隐藏的div，用户点击 Headers （通知）打开 . 默认情况下隐藏“子面板”div，但是当用户单击“通知”一词时，它将使用jquery切换打开/关闭 .

我如何修改我的jquery，以便如果用户点击切换打开的div（子面板）外部，这也会触发子面板关闭/隐藏？

<div class="notiftitle" id="notiftitle">
<a href="#" class="alerts">Notifications</a>
 <div class="subpanel">
    <div id="title">New Notifications</div>
    <ul>
      <li>Data</li>
    </ul>
  </div>
</div>

$(document).ready(function(){

    //Switch the "Open" and "Close" state per click then slide up/down (depending on open/close state)
    $(".alerts").click(function(){
        $(this).toggleClass("notiftitleactive");
        $(this).toggleClass("active").next().slideToggle(50);
        return false; //Prevent the browser jump to the link anchor
    });


});

3 回答

1

听起来你需要"outerClick" -event . ouerClick jQuery plugin by Jon Kassen .

回复于 2024-04-28T18:29:16+08:00

您需要使用blur事件：

$(".alerts").blur(function(){
    $(this).toggleClass("notiftitleactive");
    $(this).toggleClass("active").next().slideToggle(50);
});

回复于 2024-04-28T18:29:16+08:00

1

试试mouseout方法 .

回复于 2024-04-28T18:29:16+08:00

JQUERY：如果用户在其外部点击，则关闭div

3 回答

相关问题