Javascript 如何在单击“孩子”时不激活“母亲”？_Javascript_Jquery

Javascript 如何在单击“孩子”时不激活“母亲”？

javascript jquery

Javascript 如何在单击“孩子”时不激活“母亲”？,javascript,jquery,Javascript,Jquery,执行此操作的最佳方法是，单击其子级时不要激活父级。现在，单击子对象时，两个对象都被激活 <!DOCTYPE html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <meta http-equiv="Content-Type" content="text

执行此操作的最佳方法是，单击其子级时不要激活父级。现在，单击子对象时，两个对象都被激活

<!DOCTYPE html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script>
$(document).ready(function(){

    $('#child').click(function(){
        $('#output').append('Child is activated ||')
    })

    $('#mother').on('mousedown',function(){
        $('#output').append('Mother is activated ||')
    })


})
</script>
</head>

<style>
#mother,#child,#output{
display:block;
color:white;
font-weight:bold;
cursor:pointer;
}
#mother{
width:100px;height:100px;
padding:30px;
margin:20px;
background-color:purple;
}
#child{
width:100px;height:100px;
background-color:orange;
}
#output{
    width:300px;height:100px;
border:2px solid red;
color:black;    
}
</style>
<body>
    <h1>Click Child, I don't want to activate mother when clicking child</h1>
<div id='mother'>
    Mother
    <div id='child'>Child</div>

</div>
<div id='output'> Output:  </div>

</body>
</html>


$（文档）.ready（函数（）{
$（“#子项”）。单击（函数（）{
$（“#输出”）.append（'Child is activated | |'）
})
$（'#mother'）.on（'mousedown'，function（）{
$（“#输出”）.append（'Mother is activated | |'）
})
})
#母亲、孩子、输出{
显示：块；
颜色：白色；
字体大小：粗体；
光标：指针；
}
#母亲{
宽度：100px；高度：100px；
填充：30px；
利润率：20px；
背景颜色：紫色；
}
#孩子{
宽度：100px；高度：100px；
背景颜色：橙色；
}
#输出{
宽度：300px；高度：100px；
边框：2倍纯红；
颜色：黑色；
}
单击孩子，我不想在单击孩子时激活母亲
母亲
小孩
输出：

试试这个

$('#child').on('mousedown', function(e){
    e.stopPropagation();
    $('#output').append('Child is activated ||')
})

$('#mother').on('mousedown',function(){
    $('#output').append('Mother is activated ||')
})

哦…我必须在mousedown上同时使用，或者在mousedown上同时使用click（）？好的，非常有用，我要设置一组变量和条件，我知道有一个简单的注意事项，

click

事件是一个

mousedown

，然后在同一个元素上使用

mouseup

，因此，您的

mousedown

处理程序将在确定是否会发生

单击之前被触发。