Question

这只是一个示例代码，我希望在按钮点击时使用id =“img”隐藏div以及在id =“img”

之外的div

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="img">
<button id"imgoption"> click here</butoon>
</div>

这里是脚本

<script>
 $(document).on('click', function(e) { // Hides the div by clicking any where in the screen

      if ( ! $(e.target).closest('#img').length ){
            $('#imgoption').hide();
        }
        if ( $(e.target).closest('#img').length ) {
              $("#imgoption").show();
        }

    });
}):
</script>

3 个答案:

答案 0 :(得分：1)

答案 1 :(得分：1)

答案 2 :(得分：0)

Answer 1

我认为您使用.parent()或.parents()之类的相对选择器来从$("imgoption")点击事件中遍历您的dom。

＆＃13;

$("#imgoption").click(function () {
  $(this).parents("#img").hide();
  //you can technically do $(this).parent().hide(), but if you add more dom, the former is more bullet proof.
})

＆＃13;

div#img {
  padding:40px;
  background-color:blue;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- NOTE: I did fix typos from your example -->
<div id="img">
    <button id="imgoption"> click here</button>
</div>

＆＃13;

免责声明：如果这不是您的意思，请发表评论。

Answer 2

为此目的使用mouseup。

＆＃13;

 $(document).mouseup(function(e) {
  var container = $("#img");
  var con = $("#imgoption");
if (!container.is(e.target))
  container.hide();
if (con.is(e.target))
  container.parents().hide();
});

＆＃13;

div {
  width: 100px;
  margin: auto;
  border: 3px solid;
  height: 100px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="img">
  <button id "imgoption"> click here</butoon>
</div>

＆＃13;

Answer 3

像这样使用：

<script>
 $(document).on('click', function(e) {

      if ( ! $(e.target).closest('#img').length ){
            $('#img').hide();
            //or
            $('#img').parent().hide();
        }
        if ( $(e.target).closest('#img').length ) {
              $("#img").show();
              //or
              $('#img').parent().show();
        }

    });
}):
</script>

如何通过jquery隐藏除div中的div之外的div

3 个答案: