jQuery löst ein Ereignis aus, wenn außerhalb des Elements geklickt wird

$(document).click(function(evt) {
    var target = evt.currentTarget;
    var inside = $(".menuWraper");
    if (target != inside) {
        alert("bleep");
    }

});

Ich versuche herauszufinden, wie man es so machen, dass wenn ein Benutzer auf eine Stelle außerhalb eines bestimmten div (menuWraper), es löst ein Ereignis aus.. ich merkte, ich kann nur jeden Klick ein Ereignis auslösen, dann überprüfen Sie, ob der angeklickte currentTarget ist dasselbe wie das ausgewählte Objekt aus $(".menuWraper"). Aber so funktioniert das nicht, currentTarget, die das HTML-Objekt(?) und $(".menuWraper") ist eine Objekt-Objekt? Ich bin sehr verwirrt.

InformationsquelleAutor der Frage tpae | 2010-07-23

javascript jquery

62

Müssen nur Ihre menuWraper element nennen event.stopPropagation() so, dass der click-event nicht Blase bis zu den document.

Probieren Sie es aus: http://jsfiddle.net/Py7Mu/
```
$(document).click(function() {
    alert('clicked outside');
});

$(".menuWraper").click(function(event) {
    alert('clicked inside');
    event.stopPropagation();
});
```
- http://api.jquery.com/event.stopPropagation/
Alternativ könnte man return false; anstatt event.stopPropagation();

InformationsquelleAutor der Antwort user113716

wenn Sie child-Elemente wie dropdown-Menüs

$('html').click(function(e) {
  //if clicked element is not your element and parents aren't your div
  if (e.target.id != 'your-div-id' && $(e.target).parents('#your-div-id').length == 0) {
    //do stuff
  }
});

InformationsquelleAutor der Antwort Alexey Sukhikh

9

Die häufigste Anwendung ist hier schließen bei Klick auf das Dokument, nicht aber, wenn es kam, von diesem element, für das Sie möchten, stoppen Sie die Blasen, wie diese:
```
$(".menuWrapper").click(function(e) {
  e.stopPropagation(); //stops click event from reaching document
});
$(document).click(function() {
  $(".menuWrapper").hide(); //click came from somewhere else
});
```
Alle hier machten verhindert, dass das klicken von sprudeln (über - Ereignis.stopPrpagation()) wenn es innerhalb eines .menuWrapper element. Wenn diese nicht passieren, das klicken kam von irgendwo anders, und wird standardmäßig machen es so bis zu document, wenn er dort ankommt, verstecken wir diese .menuWrapper Elemente.

InformationsquelleAutor der Antwort Nick Craver

versuchen Sie, diese..

$(document).click(function(evt) {
    var target = evt.target.className;
    var inside = $(".menuWraper");
    //alert($(target).html());
    if ($.trim(target) != '') {
        if ($("." + target) != inside) {
            alert("bleep");
        }
    }
});

InformationsquelleAutor der Antwort rob waminal

2

Ich weiß, dass die Frage beantwortet wurde, aber ich hoffe, meine Lösung hilft anderen Menschen.

stopPropagation verursacht Probleme in meinem Fall, denn ich brauchte die click Ereignis-für etwas anderes. Außerdem, nicht jedes element sollte dazu führen das div geschlossen werden, wenn auf Sie geklickt wird.

Meine Lösung:
```
$(document).click(function(e) {
    if (($(e.target).closest("#mydiv").attr("id") != "mydiv") &&
        $(e.target).closest("#div-exception").attr("id") != "div-exception") {
        alert("Clicked outside!");
    }
});
```
http://jsfiddle.net/NLDu3/

InformationsquelleAutor der Antwort edjroot

Diesem code öffnet sich das Menü in Frage, und setup wird ein click-Ereignis-listener. Wenn ausgelöst, es wird eine Schleife durch die target-id ' s Eltern, bis er eine findet die Menü-id. Wenn das nicht der Fall, wird das Menü ausblenden, da der Benutzer geklickt hat, außerhalb des Menüs. Ich habe es getestet und es funktioniert.

function tog_alerts(){
   if($('#Element').css('display') == 'none'){
       $('#Element').show();
       setTimeout(function () {
           document.body.addEventListener('click', Close_Alerts, false);
       }, 500);
   }
}

function Close_Alerts(e){
   var current = e.target;
   var check = 0;
   while (current.parentNode){
      current = current.parentNode
      if(current.id == 'Element'){
         check = 1;
      }
   }
   if(check == 0){
      document.body.removeEventListener('click', Close_Alerts, false);
      $('#Element').hide();         
   }
}

InformationsquelleAutor der Antwort Baz Love

1

Ich denke nicht das Dokument löst das click-Ereignis. Versuchen Sie es mit dem body-element zu erfassen, das click-Ereignis. Möglicherweise müssen Sie check auf, dass...

InformationsquelleAutor der Antwort iWantSimpleLife

versuchen, diese

    $(document).click(function(event) {

        if(event.target.id === 'xxx' )
            return false;
        else {
              //do some this here
        }

    });

InformationsquelleAutor der Antwort Muhammad Usman

$(document).click((e) => {
  if ($.contains($(".the-one-you-can-click-and-should-still-open").get(0), e.target)) {
  } else {
    this.onClose();
  }
});

InformationsquelleAutor der Antwort Jack Vo

function handler(event) {
 var target = $(event.target);
 if (!target.is("div.menuWraper")) {
  alert("outside");
 }
}
$("#myPage").click(handler);

InformationsquelleAutor der Antwort ghazizadeh

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.