单击子元素时,toggleClass不起作用

时间:2016-01-18 09:18:51

标签: javascript jquery html css toggleclass

我正在我的网站上使用.toggleClass 隐藏/显示 div ,它可以按照我的意愿运行,但只有在我点击时div本身而不是它的子元素(三个 span )所以我必须单击div本身,但我没有得到的是为什么它检测到点击但不执行{ {1}}点击这些跨度?

Html:

toggleClass

Javascript:

<div class="ClicLog Login" id="BoutonLogin">
    <span class="ico-Login"></span>
    <span class="noMobile" id="boutonConnectText">MON COMPTE</span>
    <span class="ico-Menu"></span>
</div>

谢谢!

5 个答案:

答案 0 :(得分:0)

您只将事件处理程序附加到div而不是其子项。

试试这个:

$('.ClicLog > span').click(function () {
    console.log("clic !");
    $('.nocollapse').toggleClass('LoginTest');
});

答案 1 :(得分:0)

添加范围

$('.ClicLog').children('span').click(function () {
    console.log("clic !");
    $('.nocollapse').toggleClass('LoginTest');
});

答案 2 :(得分:0)

试试这个

$('.ClicLog').on('click','*',function () {
    console.log("clic !");
    $('.nocollapse').toggleClass('LoginTest');
});

答案 3 :(得分:0)

使用.on() 您可以使用您喜欢的任何选择器及其第二个参数。

$('.ClicLog').on('click', '*', function() {
  console.log("clic !");
  $('.nocollapse').toggleClass('LoginTest');
});

$('.ClicLog').on('click', '> *', function() {
  console.log("clic !");
  $('.nocollapse').toggleClass('LoginTest');
});

直接后代。

https://jsfiddle.net/x9tsv7bo/

答案 4 :(得分:0)

好吧,我发现了问题:有一个javascript关闭我想要打开的div,当点击除了div之外的其他地方,所以点击跨度打开并立即关闭div ...我想我检查了它之前但显然不是。谢谢大家的帮助!