JQuery: щелкните мышью, если внутри div или нет.

У меня есть эта страница HTML

<html>
<body>
<div>a</div>
<div>b</div>
<div>c</div>
<div>d</div>
<div id='in_or_out'>e</div>
<div>f</div>
</body>
</html>

a, b, c, d, e и f могут быть divs также не только простым текстом.

Я хочу получить событие щелчка мыши, но как я могу узнать, внутри он или снаружи #in_or_out div?

EDIT:: ребята, я знаю, как проверить, нажал ли div или нет, но я хочу, чтобы мое событие было запущено, когда клик находится вне этого div

Ответ 1

$("body > div").click(function() {
    if ($(this).attr("id") == "in_or_out") {
        // inside
    } else {
        // not inside
    }
});

EDIT: только что узнал, что есть отрицание:

$("body > div:not(#in_or_out)").click(function(e) {
    // not inside
});

Ответ 2

Если вы хотите определить, нажали ли вы внутри или вне div, установите обработчик событий на documentElement и передайте его другим элементам вверх:

$("html").click(function (e)
{
    if (e.target == document.getElementById("in_or_out"))
        alert("In");
    else
        alert("Out!");
});

Ответ 3

Возможно, этот поможет вам

$('body').click(function(){
    //do smth
});
$('div#in_or_out').click(function(e){
    e.stopPropagation();
    // do smth else
});

Ответ 4

Зависит от того, что вы хотите. Если вы хотите только выполнить код, когда он был внутри #in_or_out, вы можете сделать:

$('#in_or_out').click(function(){ /* your code here */ });

У вас может быть переменная статуса, указывающая, находится ли указатель мыши в #in_or_out или нет:

var inside = false;

$('#in_or_out').hover(function() { inside = true; }, function() { inside = false; });

Затем всякий раз, когда происходит щелчок, вы можете проверить с помощью inside, был ли щелчок внутри in_or_out или нет.

Ссылка: .hover()

Update:

Независимо от того, к какому элементу вы привязываете обработчик click, вы всегда можете сделать это:

$('element').click(function() {
     if ($(this).attr('id') !== 'in_or_not') {

     }
 });

Ответ 5

для внутри него было бы

$("#in_or_out").click(function() {
    // do something here
});

для снаружи... Я понятия не имею.

Изменить:. Вы можете попытаться сделать то же самое для body-tag (назначая обработчик кликов самому документу). Но я не уверен, что оба события будут срабатывать.

Ответ 6

Как это?

$("#in_or_out").click(function() {
    alert("IN DIV!");
});