Kennt jemand ein onHide () -Ereignis oder etwas Ähnliches in jQuery?
Ich habe es versucht:
$(this).bind('hide', function(){
console.log('asdasda')
})
Aber anscheinend funktioniert das nicht.
Edit: Nur um es klar zu stellen, wird es mit CSS display:none
ausgeblendet.
Ich kenne die Rückruffunktion, aber da ich sie nicht verstecke (das CSS ist), kann ich sie nicht verwenden. Für was es wert ist, muss ich überprüfen, wann ein Dropdown angezeigt wird. Es wird durch das folgende CSS gezeigt:
ul li:hover ul {
display: block;
}
Es gibt kein "Hide" -Ereignis für ein HTML-Element im DOM. Wie "verstecken" Sie Ihre Elemente? Verwenden Sie CSS, um die Anzeige oder Sichtbarkeit zu ändern?
Wenn Sie mit display: none ein Element ausblenden, können Sie nicht erkennen, wenn sich CSS ändert. Im Internet Explorer können Sie erkennen, wenn sich eine Eigenschaft ändert, dies gilt jedoch nicht für Stilwerte. Sie müssen ein Ereignis auslösen oder tun, was immer das Ereignis zum Zeitpunkt der Änderung der CSS-Anzeige tut.
Es gibt kein natives oder eingebautes "hide" -Ereignis, aber wenn Sie jQuery zum Ausblenden verwenden, können Sie problemlos ein Hide-Ereignis hinzufügen:
var _oldhide = $.fn.hide;
$.fn.hide = function(speed, callback) {
$(this).trigger('hide');
return _oldhide.apply(this,arguments);
}
Sie können die Rückruffunktion in der Hide-Funktion übergeben.
function iAmCallBackForHide() {
alert('I am visible after hide');
}
$('#clickMeToHide').hide( iAmCallBackForHide );
Für jeden, der diesen Beitrag zwei Jahre später findet:
Sie wissen genau wann das Menü sichtbar ist, oder ?! Die CSS-Regel sagt es Ihnen. Anstatt sich auf onShow- oder onHide-Ereignisse zu verlassen, können Sie die gleiche Regel neu erstellen mit jQuery und dasselbe 'Hover-Ereignis' verwenden:
$('ul li').hover(function () {
// Whatever you want to do 'onShow'
}, function () {
// Whatever you want to do 'onHide'
});
Außerdem agiert Ihr Skript jetzt unabhängig von einem Stylesheet, so dass die Details der Präsentation kein Verhalten der Website bestimmen (Nizza).
Ich habe kürzlich ein Plugin erstellt, um herauszufinden, wann ein Element versteckt oder in irgendeiner Weise angezeigt wird (durch Kern-Javascript oder -Inspektor oder jQuery-Hide/Show).
Diese Erweiterung überwacht ständig das Element, um die Sichtbarkeit zu ändern. Einmal geändert, wird ein Ereignis ausgegeben, bei dem Sie Ihre Sachen bearbeiten können
$("#test_hidden").hideShow(function(e, visibility){
if(visibility == "shown") {
console.log("Element is visible");
} else {
console.log("Element is hidden");
}
})
In jQuery 3 werden Ereignisse "hide" und "show" angezeigt.
$(document).on("hide", function() {
console.log("browser page has been hidden");
});
Easy-pizy, verwenden Sie DOM-Mutationsbeobachter hierfür:
JS:
var observer = new MutationObserver(function(mutations) {
console.log('div hide event fired!');
});
var target = document.querySelector('.mydiv');
observer.observe(target, {
attributes: true
});
HTML:
<div class='mydiv'>
</div>
Hier ist die Geige https://jsfiddle.net/JerryGoyal/qs01umdw/2/
Dies kann in einigen Anwendungsfällen hilfreich sein: Mithilfe des Jquery-Plugins von waitUntilExists ( Wie warte ich, bis ein Element existiert? ) können Sie erkennen, wenn sich der Wert ändert:
$(li:hidden).waitUntilExists(function(){
// your code when it is hidden
}, /*onlyOnce = */ true);
Ich habe es benutzt, um herauszufinden, wann ein Ladegif versteckt wurde.