Question

之前做了几次，但这次出了点问题。试图创建一个弹出窗口。你可以猜测，最初，它是隐藏的。它确实出现在点击，但当我试图关闭它，没有任何反应。此外，当我尝试更改样式以在开发人员工具中显示：none时，它会切换回display：block。目前它位于页面的头部，但我也尝试将它放在最底层。

html of it

<div class="tablecell midlineunit popup-hml middle">
    <div class="hml-popup-bg popupbg ">
        <div class="hml-popup-cnt">
            <div class="closepopup">X</div>
        </div>
    </div>
</div>

和js

$(".popup-hml").each(function(){
     $(this).click(function(){
         $(this).find(".hml-popup-bg").show();
     });
});
$(".closepopup").each(function(){
    $(this).click(function(){
        $(this).parent().parent().hide();
    });
});

当然.hml-popup-bg隐藏在css

中

Answer 1

你可以使用它..不需要 .each（）只需使用 .click（）就可以使用 .closest（）而不是 parent（）。parent（）;

$(".popup-hml").click(function(){
    $(this).find(".hml-popup-bg").show();
});

$(".closepopup").click(function(e){
    e.stopPropagation();
    $(this).closest('.hml-popup-bg').hide();
});

Answer 2

这应该有效。它是因为你关闭它，但不要停止传播，所以它会再次打开，通过鼓泡。

$(".popup-hml").each(function(){
     $(this).click(function(){
         $(this).find(".hml-popup-bg").show();
     });
});
$(".closepopup").each(function(){
    $(this).click(function(e){
        e.stopPropagation();
        $(this).parent().parent().hide();
    });
});

https://jsfiddle.net/qcqacbyd/

Answer 3

你对jQuery的.each（）的使用似乎是错误的。我认为你真正想要设置的是2个事件监听器 - 一个用于在单击按钮时打开弹出窗口，另一个用于在单击＆＃34; X＆＃34;时关闭它。

您可以使用以下jQuery完成此任务：

$(document).on("click", ".popup-hml", function(){
    $(".hml-popup-bg").show();
});
$(document).on("click", ".closepopup", function(){
    $('.hml-popup-bg').hide();
});

Jquery不会隐藏元素

3 个答案: