Mam bardzo duży plik javascript, który chciałbym załadować tylko wtedy, gdy użytkownik kliknie określony przycisk. Jako ramy używam jQuery. Czy istnieje wbudowana metoda lub wtyczka, która pomoże mi to zrobić?
Więcej szczegółów: Mam przycisk „Dodaj komentarz”, który powinien załadować plik javascript TinyMCE (zagotowałem wszystkie rzeczy TinyMCE do jednego pliku JS), a następnie wywołać tinyMCE.init (...).
Nie chcę tego wczytywać podczas początkowego ładowania strony, ponieważ nie każdy kliknie „Dodaj komentarz”.
Rozumiem, że mogę po prostu zrobić:
$("#addComment").click(function(e) { document.write("<script...") });
ale czy jest lepszy / zamknięty sposób?
javascript
jquery
jquery-plugins
tinymce
lazy-loading
Jeff Meatball Yang
źródło
źródło
Odpowiedzi:
Tak, użyj getScript zamiast document.write - pozwoli to nawet na wywołanie zwrotne po załadowaniu pliku.
Możesz jednak chcieć sprawdzić, czy TinyMCE jest zdefiniowane przed włączeniem go (dla kolejnych wywołań `` Dodaj komentarz ''), aby kod mógł wyglądać mniej więcej tak:
init
To znaczy zakładając, że będziesz musiał do niego zadzwonić tylko raz. Jeśli nie, możesz to rozgryźć stąd :)źródło
Zdaję sobie sprawę, że jestem trochę spóźniony (około 5 lat), ale myślę, że jest lepsza odpowiedź niż zaakceptowana, jak następuje:
Ta
getScript()
funkcja faktycznie zapobiega buforowaniu przeglądarki . Jeśli uruchomisz śledzenie, zobaczysz, że skrypt jest ładowany z adresem URL zawierającym parametr timestamp:Jeśli użytkownik kliknie
#addComment
link wiele razy,tinymce.js
zostanie ponownie załadowany z adresu URL z inną sygnaturą czasową. To mija się z celem buforowania przeglądarki.===
Alternatywnie w
getScript()
dokumentacji znajduje się przykładowy kod, który pokazuje, jak włączyć buforowanie, tworząc funkcję niestandardowącachedScript()
w następujący sposób:===
Jeśli chcesz globalnie wyłączyć buforowanie, możesz to zrobić
ajaxSetup()
w następujący sposób:źródło
$.getScript({url: "test.js",cache:true})