it-swarm.com.de

Kann ich $ (document) .ready () aufrufen, um alle On-Load-Ereignishandler wieder zu aktivieren?

Weiß jemand zufällig, WENN und WIE ich alle On-Load-Ereignishandler erneut aufrufen könnte? Ich beziehe mich auf einige .js-Dateien, über die ich NICHT die Kontrolle habe, und diese .js-Bibliotheken führen ihre Initialisierung in $ (document) .ready () durch und bieten leider keine einfache Funktion zum erneuten Initialisieren.

Ich versuche gerade, einen großen div-Block durch den Inhalt eines Ajax-Aufrufs zu ersetzen, und ich muss die externen Bibliotheken neu initialisieren. Es wäre also schön, einfach $ (document) .ready () aufzurufen, um ALLES neu zu initialisieren.

Bisher habe ich dies beim Ajax-Aufruf versucht:

success: function(data) {
    alert('1'); // Displays '1'
    $('#content').html(data);
    alert('2'); // Displays '2'
    $(document).ready();
    alert('3'); // Does not display
}

Der Aufruf von $(document).ready(); schlägt ebenfalls leise fehl. JavaScript-Konsole zeigt keine Fehler. Weiß jemand, ob dies möglich ist (ohne die JavaScript-Bibliotheksdateien zu ändern)?

38
Mike Richards

Da Sie gefragt wurden, wie Sie dies tun sollen, ohne die externen JS-Dateien zu ändern, werde ich auf diese Weise antworten. Ich habe durch die Funktion .ready() in jQuery im Debugger nachverfolgt, und es scheint, dass die Stammfunktion, die aufgerufen wird, wenn die Seite fertig ist, Folgendes ist:

jQuery.ready();

Es scheint jedoch, dass Sie es nicht einfach erneut aufrufen können, um das zu erreichen, was Sie möchten, denn es scheint, als würde es beim ersten Auslösen von den zuvor registrierten Funktionen getrennt (z. B. Vergessen). Wenn Sie jQuery.ready() manuell ein zweites Mal aufrufen, werden die gleichen Funktionsaufrufe nicht erneut ausgelöst, und ich habe das im Debugger überprüft (Haltepunkt wurde nur einmal getroffen, nicht das zweite Mal). 

Es scheint also, dass Sie dieses Problem nicht lösen können, ohne die jQuery-Implementierung so zu ändern, dass sie die Bindung aufhebt (um mehrere Schüsse zuzulassen) oder jeden Code des bereitgestellten Handlers so zu ändern, dass er Ihre eigenen Ereignisse verwendet, die Sie so oft auslösen können wollen.

37
jfriend00

Ich habe so etwas gemacht:

// When document is ready...
$(function(){
    onPageLoad();
});

function onPageLoad(){
  // All commands here
}

Jetzt kann ich diese Funktion jederzeit aufrufen.

28
Fabio Nolasco

Eine einfache Möglichkeit, dies zu erreichen, besteht darin, einfach so ein eigenes Event zu erfinden:

$(document).bind('_page_ready', function() { /* do your stuff here */});

Dann füge das hinzu:

$(function() { $(document).fire('_page_ready'); }); // shorthand for document.ready

Und als letztes immer, wenn Sie es erneut ausführen müssen, rufen Sie einfach Folgendes auf:

$(document).fire('_page_ready');

[Bearbeiten]

Wenn Sie die externen Skript-Dateien wirklich nicht bearbeiten können, habe ich ein jsFiddle erstellt, das Ihnen das ermöglicht, was Sie tun möchten. Hier können Sie sich den Code ansehen: http://jsfiddle.net/5dRxh/

Wenn Sie dies jedoch nicht verwenden möchten, ist es wichtig, dass Sie dieses Skript RECHTS hinzufügen, nachdem Sie jQuery hinzugefügt haben.

<script src="jquery.js" type="text/javascript"></script>
<script>
    //script from jsFiddle (only the plugin part at the top).
</script>
<!-- All the other script-files you want to include. -->
12
Alxandr

Ich denke nicht, dass dies möglich ist, da jquery das ready -Ereignis nach der Ausführung aufhebt. Von der Quelle:

// Trigger any bound ready events
if ( jQuery.fn.trigger ) {
    jQuery( document ).trigger( "ready" ).unbind( "ready" );
}
5
natedavisolds

Sie können dies einfach tun.

Machen Sie eine Funktion:

function REinit() {
        /// PLACE HERE ALL YOUR DOC.READY SCRIPTS
}

Platziere nur die Reinit () - Funktion in doc.ready:

$(document).ready(function(){
    REinit();
});

dann nach einer ajax-aktion einfach anrufen 

REinit();
2
catalin87

Sie können document.ready zum zweiten Mal auslösen, wenn Sie den gesamten Inhalt des Körpers ändern:

$('body').html($('body').html())
2
zoberg

Ich denke, es ist einfach, das ready-Event einfach auf den Erfolg von pjax umzustellen

Ändern Sie es von:

$(document).ready(function() {
    // page load stuff
});

Zu:

$(document).on('ready pjax:success', function() {
    // will fire on initial page load, and subsequent PJAX page loads
});
1
Islam Wazery

Dies ist, was Sie wollen, halten Sie einfach das fertige Ereignis, bis Sie wirklich bereit sind.

https://api.jquery.com/jquery.holdready/

1
Lomax

Oder probiere es aus:

jQuery.extend ({

    document_ready: function (value) {
        $(document).ready (value);
        $(document).ajaxComplete (value);
    }/* document_ready */

});

Und anstatt eine Funktion zu definieren, indem Sie sagen:

$(document).ready (function () { blah blah blah });

sagen:

jQuery.document_ready (function () { blah blah blah });

Erläuterung:

Jede in "document_ready" geladene Funktion wird automatisch in "$ (document) .ready ()" und "$ (document) .ajaxComplete ()" geladen und wird in beiden Fällen ausgelöst.

0
rexthestrange

Ich hatte gerade das Problem, dass mein ajax Code nur funktionierte, wenn es von der $(document).ready(function(){}); und nicht in einer regulären Funktion aufgerufen wurde, also konnte ich es nicht einwickeln.
Im Code ging es darum, einen Teil meiner Seite zu laden und einige fehler beim Laden Ich wollte, dass es nach einer timeout erneut aufgerufen wird. 

Ich habe herausgefunden, dass der Code nicht sein muss im die $(document).ready(function(){}); kann aber von ihm ausgeführt werden und kann auch sein von selbst aufgerufen.

Nachdem ich nun viele Lösungen von verschiedenen Seiten gelesen habe, habe ich diesen Code gemischt:


$(document).ready(loadStuff);   

function loadStuff(){   
    $.ajax({
        type: "POST",
        url: "path/to/ajax.php",
        data: { some: data, action: "setContent"},
        timeout: 1000, //only one second, for a short loading time
        error: function(){ 
            console.log("An error occured. The div will reload.");
            loadStuff(); 
        },
        success: function(){
            $("#divid").load("path/to/template.php"); //div gets filled with template
        }
    });
}
0
S.Witch