Question

我发现了一个使用jQuery的offClick事件，但它没有像我预期的那样工作。

当我点击左眼时，我想要出现lefteyedes，确实如此。但是当我点击righteye时我想要righteyedes出现并且lefteyedes消失（opacity = 0）

<script>
$(document).ready(function() {
    $("#face").find("*").click(function(){
        $(this).addClass("opacity description");
          $("#face > *").not(this).removeClass("opacity");
                    });


    $('#lefteye').click(function() {
        $('#lefteyedes').removeClass('opacity');
        });             
    $('#face').click(function() {
    $("#lefteyedes").addClass("opacity");
}); 

    $("#lefteye").click(function(e) {
    $("#lefteyedes").removeClass('opacity');
    e.stopPropagation();
});



    $('#righteye').click(function() {
        $('#righteyedes').removeClass('opacity');
        });             
    $('#face').click(function() {
    $("#righteyedes").addClass("opacity");
}); 

    $("#righteye").click(function(e) {
    $("#righteyedes").removeClass('opacity');
    e.stopPropagation();
});



});


</script>


<style>
.opacity {
    opacity: 0;
    }
#face {
    background-image: url(face.png);
    width: 262px;
    height: 262px;
    }
#lefteye {
    background-image: url(circle.png);
    width: 28px;
    height: 28px;
    position: relative;
    top: 69px;
    left: 59px;
    }
#righteye {
    background-image: url(circle.png);
    width: 28px;
    height: 28px;
    position: relative;
    top: 41px;
    left: 167px;
    }
#mouth {
    background-image: url(circle.png);
    width: 28px;
    height: 28px;
    position: relative;
    top: 84px;
    left: 114px;
    }
</style>
</head>

<body>
    <br><br>
    <div id="face">
        <div id="lefteye">
        </div>
        <div id="righteye">
        </div>
        <div id="mouth">
        </div>
    </div>
        <div id="lefteyedes" class="opacity">
            <p>Left Eye</p>
        </div>
        <div id="righteyedes" class="opacity">
            <p>Right Eye</p>
        </div>
        <div id="mouthdes" class="opacity">
            <p>Mouth</p>
        </div>

Answer 1

如果我理解你的问题。当您点击要显示#righteye的{{1}}时，或者用其他字词删除课程righteyedes。所以我假设你的opacity课程是“隐藏”项目。我想请注意，您只需使用opacity和.hide()即可。但是使用你的代码可以做到这一点：

.show()

Makeshift off Click事件无法正常工作

1 个答案: