[英]Clickable div except for links and buttons
在我的Web應用程序上,單擊時隱藏了一個div。 然后出現一個新的div(視頻)。 我的問題是我在第一個div中有一個upvote按鈕和一個鏈接,但是如果單擊它們,該div將隱藏並彈出視頻,而不是所需的功能。
我該怎么辦,如果他們單擊按鈕或鏈接,它不會隱藏第一個div並顯示視頻?
<script type="text/javascript">
$(function () {
$('.videoDiv').hide();
$('.firstDiv').on('click', function () {
$('.videoDiv').show();
$('.firstDiv').hide();
});
});
</script>
第一師:
<div class="panel-body firstDiv">
<div class="col-xs-7 col-sm-8 col-md-7">
<a class="btn btn-xs btn-info" rel="nofollow" data-method="put" href="/startups/1/follow">Follow</a>
</div>
<div class="col-xs-2 col-sm-2 col-md-2">
<div class="btn-group-vertical pull-right" role="group">
<a class="btn btn-sm btn-default pull-right upvote-btn" data-type="json" data-remote="true" rel="nofollow" data-method="put" href="/startups/1/upvote">
<span class="glyphicon glyphicon-chevron-up"></span>
</a>
</div>
</div>
</div>
視頻分區:
<div class="panel-body videoDiv">
<div class="video-js-box">
<video id="" class=" video-js vjs-default-skin" controls preload="auto" width="auto" height="auto" poster="" data-setup="{}">
</video>
</div>
</div>
排除鏈接/ upvote按鈕的事件,即在div
上應用click函數,並檢查它是否不在.btn
然后執行您的語句。 另外,您需要檢查目標是否不是.btn
子.btn
<script type="text/javascript">
$(function () {
$('.videoDiv').hide();
$('.firstDiv').on('click', function (e) {
if (!$(".btn").is(e.target) //not clicked on .btn
&& $(".btn").has(e.target).length === 0) //clicked thing is not child of .btn
{
$('.videoDiv').show();
$('.firstDiv').hide();
}
});
});
</script>
嘗試利用.is()
調用.show()
.hide()
如果e.target
沒有btn
class
$(function () {
$(".videoDiv").hide();
$(".firstDiv").on('click', function (e) {
if (!$(e.target).is(".btn")) {
$(".videoDiv").show();
$(".firstDiv").hide();
};
});
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.