Как отключить клик внутри div
По многим причинам мне нужно отключить нажатие на определенный контент в элементе div. Например, из-за нажатия на рекламные атаки.
Я все еще хочу, чтобы это было видно.
Рассмотрим следующий фрагмент: -
<div class="ads">
something should be here, i do not want to be clicked
</div>
как отключить способности щелчка левой кнопкой мыши на то, что div?
Ответы
Ответ 1
Свойство CSS, которое можно использовать:
pointer-events:none
! ВАЖНО
Имейте в виду, что это свойство не поддерживается Opera Mini и IE 10 и ниже (включительно). Для этих браузеров необходимо другое решение.
СПОСОБ JQuery
Если вы хотите отключить его с помощью скрипта, а не свойства CSS, они могут вам помочь:
Если вы используете jQuery версии 1.4. 3+:
$('selector').click(false);
Если нет:
$('selector').click(function(){return false;});
Вы можете повторно включить клики с помощью pointer-events: auto; (Документация)
.Обратите внимание, что pointer-events переопределяет свойство cursor, поэтому, если вы хотите, чтобы курсор отличался от стандартного ![cursor]()
, ваш CSS должен быть на месте после pointer-events.
Ответ 2
Если вы хотите его в чистом CSS:
pointer-events:none;
Ответ 3
Попробуйте следующее:
pointer-events:none
Добавление выше по указанному элементу HTML предотвратит все параметры щелчка, состояния и курсора.
http://jsfiddle.net/4hrpsrnp/
<div class="ads">
<button id='noclick' onclick='clicked()'>Try</button>
</div>
Ответ 4
Как отключить щелчок по другому элементу div, пока не закроется первый всплывающий элемент div
![Image of the example]()
<p class="btn1">One</p>
<div id="box1" class="popup">
Test Popup Box One
<span class="close">X</span>
</div>
<!-- Two -->
<p class="btn2">Two</p>
<div id="box2" class="popup">
Test Popup Box Two
<span class="close">X</span>
</div>
<style>
.disabledbutton {
pointer-events: none;
}
.close {
cursor: pointer;
}
</style>
<script>
$(document).ready(function(){
//One
$(".btn1").click(function(){
$("#box1").css('display','block');
$(".btn2,.btn3").addClass("disabledbutton");
});
$(".close").click(function(){
$("#box1").css('display','none');
$(".btn2,.btn3").removeClass("disabledbutton");
});
</script>
Ответ 5
Если вы используете функцию onclick DIV, а затем хотите отключить ее, нажмите еще раз, вы можете использовать это:
for (var i=0;i<document.getElementsByClassName('ads').length;i++){
document.getElementsByClassName('ads')[i].onclick = false;
}
Пример:
HTML
<div id='mybutton'>Click Me</div>
Javascript
document.getElementById('mybutton').onclick = function () {
alert('You clicked');
this.onclick = false;
}
Ответ 6
Вы можете использовать CSS
.ads{pointer-events:none}
или Использование события предотвращения JavaScript
$("selector").click(function(event){
event.preventDefault();
});
, ваш CSS должен быть на месте после 