Jquery -隐藏Div，如果不是按钮，则在DIV上单击其他按钮

hmae6n7t 于 2023-06-05 发布在 jQuery

关注(0)|答案(4)|浏览(265)

我有一个包含内容和按钮的Div容器。我想做的是

如果用户单击<div>或其内容，则隐藏<div>及其内容。
如果用户在<div>中单击<button>，则不要隐藏<div>或其内容。

我的意思是，它总是发生，除非用户单击div内部的button。
HTML：

<div class="container active">
    <h1>Hello world</h1>
    <p>teressdsasas</p>
    <div class="ticket-nos">
        <div class="input-group">
            <div class="btn-left">
                <div class="input-group--btn">
                    <button class="btn btn-default ticket-nos-btn minus" type="button" data-type="minus"><i class="fa fa-minus" aria-hidden="true"></i></button>
                </div>
            </div>
        </div>
    </div>
</div>

JavaScript：

$('.container').on('touchstart', function() { $(this).hide(); });

jquery

来源：https://stackoverflow.com/questions/48414165/jquery-hide-div-if-other-than-button-else-where-clicked-on-div

4条答案

按热度按时间

p5fdfcr11#

你可以使用下面的代码来检查这是否是一个按钮。

$(document).on('touchstart', function(event) {
        var target = $(event.target);    
    if (target.parent('div.container').length || target.is('div.container'))
    {
        if(target.is('div.container'))
        {           
            $('div.container').hide();

        }
        else
        {  
             // Do something here....
        }
    }
    else
    {
        console.log(target);
    }
});

赞(0）回复(0）举报 2023-06-05

zy1mlcev2#

您可以检查target of the event的标记名称。它是按钮做任何你想做的事。
注意：不要忘记stop the propogation到父。

赞(0）回复(0）举报 2023-06-05

t9aqgxwy3#

只需将事件stopPropagation()添加到按钮选择器

$(".ticket-nos-btn").click(function(e) {
  e.stopPropagation();
});

赞(0）回复(0）举报 2023-06-05

qncylg1j4#

您可以通过单击button来return false;：

$(document).on('click', 'p', function() {
  $(this).hide();
})

$(document).on('click', 'p button', function() {
  console.log('button click');
  return false;
})

p {
  padding: 40px;
  border: dashed 2px lightgreen;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p><button>button</button>

赞(0）回复(0）举报 2023-06-05

我来回答

Jquery -隐藏Div，如果不是按钮，则在DIV上单击其他按钮

4条答案

相关问题

热门标签

最新问答