我对此很困惑。我希望单击仅在存在体内的某个类时发生，而不是在存在其他类时才发生。
当您单击时，我会将类添加到主体，但是在我的代码中，jquery仍然允许在单击时进行操作。
代码笔：https://codepen.io/omarel/pen/LLbwyq
的HTML
<html>
<body class="comp-mode-off">
<div class="sharelink">click</div>
<div class="togglecompmode">toggle comp mode</div>
</body>
</html>
JQUERY
var sharelinkbtn = $( ".comp-mode-off .sharelink" );
$( sharelinkbtn ).on( "click", function() {
alert("hi"); //should only happen when .comp-mode-off exists.
});
$( '.togglecompmode' ).on( "click", function() {
$('body').toggleClass( "comp-mode-off comp-mode-on"); //but when i remove it, it still happens
});
最佳答案
您正在绑定最初选择的元素，但是更新主体class不会对附加的处理程序进行任何更改。因此，仅当主体存在类时才使用event delegation触发。
// use the selector as second argument
$(document).on( "click", 'body.comp-mode-off .sharelink', function() {
alert("hi");
});
$(document).on("click", 'body.comp-mode-off .sharelink', function() {
alert("hi");
});
$('.togglecompmode').on("click", function() {
$('body').toggleClass("comp-mode-off comp-mode-on");
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body class="comp-mode-off">
<div class="sharelink">click</div>
<div class="togglecompmode">toggle comp mode</div>
</body>或在处理程序中检查主体是否存在类。
var sharelinkbtn = $( ".comp-mode-off .sharelink" );
$( sharelinkbtn ).on( "click", function() {
// check class exists or not
if($('body.comp-mode-off').length){
// or use $('body').hasClass('comp-mode-off')
alert("hi");
}
});
var sharelinkbtn = $(".comp-mode-off .sharelink");
$(sharelinkbtn).on("click", function() {
// check class exists or not
if ($('body.comp-mode-off').length) {
// or use $('body').hasClass('comp-mode-off')
alert("hi");
}
});
$('.togglecompmode').on("click", function() {
$('body').toggleClass("comp-mode-off comp-mode-on"); //but when i remove it, it still happens
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body class="comp-mode-off">
<div class="sharelink">click</div>
<div class="togglecompmode">toggle comp mode</div>
</body>关于javascript - 当出现体内类时，请防止单击。\，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44592079/