Javascript 如何在内容div中淡出div

大家好，我有这个脚本，当我单击

.content

div

fade

$（'.d-menu'）

元素时，我需要它，但是当我单击

.d-menu

时，它的fadeIn和fadeOut非常快：( 附笔

.content

是主

div

$（document.body）.on（'click'，'f-menu'，function（）{
$（'d-menu'）。衰减切换（200）；
});
$（document.body）.on（'click'，'content'，function（）{
$（'.d-menu'）.fadeOut（）；
})

见下面的答案
使用event.stopPropagation（）

阿斯达斯达斯德





$（文档）.ready（函数（）{
$（document.body）.on（'click'，'f-menu'，函数（事件）{
event.stopPropagation（）；
$（'d-menu'）。衰减切换（200）；
});
$（document.body）.on（'click'，'content'，函数（事件）{
event.stopPropagation（）；
$（'d-menu'）。淡出（200）；
});
$（document.body）。在（'click'，'d-menu'，函数（事件）{
event.stopPropagation（）；
});
});

---

希望这有助于发布您的html。html中的.content是什么？它工作正常，但当我单击“$（'.d-menu'）`元素此元素淡出时，我不希望此元素淡出哪个元素？

此

div

我的答案有变化。请查看我们。

<div class="f-menu"></div >
<div class="d-menu">
    <ul>
        <li><a href="#">about</a></li>
        <li><a href="#">projects</a></li>
        <li><a href="#">help</a></li>
    </ul>
</div>
$(document.body).on('click','.f-menu',function(){
    $('.d-menu').fadeToggle(200);
});
$(document.body).on('click','.content',function (){
    $('.d-menu').fadeOut();
})

 <div class="content" style="width:500px; height:500px; background:#ccc;">
        <div class="f-menu">asdasdasd</div>
        <div class="d-menu">
            <ul>
                <li><a href="#">about</a></li>
                <li><a href="#">projects</a></li>
                <li><a href="#">help</a></li>
            </ul>
        </div>

    </div>

    <script type="text/javascript" src="~/Scripts/jquery-1.10.2.js"></script>

    <script type="text/javascript">

        $(document).ready(function () {
            $(document.body).on('click', '.f-menu', function (event) {
                event.stopPropagation();
                $('.d-menu').fadeToggle(200);
            });
            $(document.body).on('click', '.content', function (event) {
                event.stopPropagation();
                $('.d-menu').fadeOut(200);
            });
            $(document.body).on('click', '.d-menu', function (event) {
                event.stopPropagation();                   
            });
        });

    </script>