Question

我正在尝试检查某个特定元素是否已被点击但是我遇到了麻烦。这是我的HTML：

<div id="my_special_id" class="switch switch-small has-switch" data-on="success" data-off="danger">
    <div class="switch-on switch-animate"><input type="checkbox" checked="" class="toggle">
        <span class="switch-left switch-small switch-success">ON</span>
        <label class="switch-small">&nbsp;</label>
        <span class="switch-right switch-small switch-danger">OFF</span>
    </div>
</div>

这是我的jQuery：

<script type="text/javascript">
$(document).ready(function() {
    $('#my_special_id').click(function() {
        if ($('#my_special_id div:first-child').hasClass('switch-on')) {
            window.alert('ON!');
        }
    });
});
</script>

我猜我的id“my_special_id”不是实际被点击的内容？

Answer 1

我猜点击事件应该有事件参数。

$(document).ready(function() {
    $('#my_special_id').click(function(e) {
        if (e.target check condition) {
            window.alert('ON!');
        }
    });
});

上面指定的参数'e'是包含有关click事件的所有信息的事件对象。所以如果你检查'e.tartget'下的所有信息，你将能够找到点击了哪一个。希望它对你有所帮助。干杯：）

Answer 2

因为您在单击复选框时正在寻找警报

$(document).ready(function() {
    $('#my_special_id input.toggle').click(function() {
        if ($('#my_special_id div:first-child').hasClass('switch-on')) {
            window.alert('ON!');
        }
    });
});

演示：Fiddle

Answer 3

点击特定课程switch-on

时，只需提醒即可

<script type="text/javascript">
     $(document).ready(function() {
         $('#my_special_id div:first-child .switch-on').on('click',function() {
                   window.alert('ON!');
          });
     });
</script>

甚至尝试

$(document).ready(function() {
    $('#my_special_id').click(function() {
        if ($(this + 'div:first-child').hasClass('switch-on')) {
            window.alert('ON!');
        }
    });
});

Answer 4

点击事件将触发你所做的任何事情。唯一一次你必须担心的是，如果你和父母和孩子都绑定了（例如你列出了#my_special_id,.switch-small - 那么你必须看e.target）。

话虽如此，您可以使用范围来限制jQuery查找div:first-child的方式。我不是百分之百地确定你所追求的是什么，但是下面的内容似乎是你所追求的：

$(document).ready(function() {
    $('#my_special_id').click(function() {
        // look for div:first-child within `this` (where `this=#my_special_id`
        // per the .click selector above)
        if ($('div:first-child',this).hasClass('switch-on')) {
            window.alert('ON!');
        }
    });
});

如果你想分别绑定到开/关，你可能想稍微改变一下。我们仍然可以检查.switch-on，只需要以不同方式遍历：

 // here we bind to the on/off buttons and not the container
$('#my_special_id .switch-small').click(function(){
  // you want the facsimilee of `div:first-child`, so (because we're now
  // within that node, we use .parent() to get back up to it
  var $firstChild = $(this).parent();
  if ($parent.hasClass('switch-on')){
     alert('ON!');
  }
});

Answer 5

这个JavaScript适用于我。

$(document).ready(function() {
    $('#my_special_id').click(function() {
        if ($('#my_special_id div:first-child').hasClass('switch-on')) {
            alert("On!");
        }
    });
});

你确定你有JQuery吗？

您的代码看起来很好我认为您在其他地方有语法错误或者您没有JQuert。

这会发出警报吗？

$(document).ready(function() {
    alert("Jquery works");
});

如果jQuery有Class做这个动作

5 个答案: