jQuery-Funktion zur Größenänderung funktioniert nicht beim Laden der Seite

Question

Wie bringe ich diese Funktion dazu, nicht nur bei der Größenänderung des Fensters, sondern auch beim ersten Laden der Seite ausgeführt zu werden?

$(window).resize(function() {
...  
});

Answer 1

Das sollten Sie verwenden:

$(document).ready(function() { /* your code */ });

Etwas unter Last geschehen lassen. Wenn Sie etwas zu arbeiten onload und onresize wollen, sollten Sie tun:

onResize = function() { /* your code */ }

$(document).ready(onResize);

$(window).bind('resize', onResize);

Answer 2

Ich denke, die beste Lösung ist, es einfach an das Load- und Resize-Ereignis zu binden:

$(window).on('load resize', function () {
    // your code
});

Answer 3

Dieses Verhalten ist gewollt.

Sie sollten Ihren Code in eine benannte Funktion einfügen und diese Funktion dann aufrufen.

Zum Beispiel:

function onResize() { ... }

$(onResize);
$(window).resize(onresize);

---

Alternativ können Sie auch ein Plugin erstellen, das automatisch einen Handler bindet und ausführt:

$.fn.bindAndExec = function(eventNames, handler) {
    this.bind(eventNames, handler).each(handler);
};

$(window).bindAndExec('resize', function() { ... });

Beachten Sie, dass es nicht korrekt funktionieren wird, wenn der Handler die event Objekts, und dass es nicht jede Überladung des bind Methode.

Answer 4

$(document).ready(onResize);
$(window).bind('resize', onResize);

hat bei mir nicht funktioniert.

Versuchen Sie

$(window).load('resize', onResize);
$(window).bind('resize', onResize);

stattdessen.

(Ich weiß, diese Frage ist alt, aber Google hat mich hierher geschickt, also...)

Answer 5

Sie können auch einfach einen Handler einrichten und selbst ein Größenänderungsereignis vortäuschen:

// Bind resize event handler through some form or fashion
$(window).resize(function(){
  alert('Resized!');
});

// Trigger/spoof a 'resize' event manually
$(window).trigger('resize');