Dodaj/append „<script>” tag html za pomocą JavaScript/jQuery

Question

przypadków użycia: Pracuję na szablonie konstruktora application.A użytkownik może budować szablony HTML za pomocą różnych elementów, takich jak pole tekstowe, pole obrazu, pokaz slajdów itp

Problem z którym mamy do czynienia to komponent pokazu slajdów. Używamy wtyczki nivoslider do jej budowy. Suwak musi mieć ustawienia takie jak użytkownik może zmienić czas przejścia, wybrać przejście itp. Użytkownik może dodać więcej niż pokazy slajdów.
Problem polega na tym, że dodajemy wiele pokazów slajdów, każdy z nich może mieć swoje własne parametry, więc nie możemy mieć wspólnej funkcji. Ponadto użytkownik może wrócić do edycji szablonu, więc musimy mieć niezależny skrypt dla każdego z nich. pokaz slajdów.

Reasearch: Mamy podstawową strukturę pracy, ale utknął w jednej place.We trzeba dołączyć script tag do każdego Pokaz slajdów dodane do strony przez użytkownika.

return '<div id="slider" class="nivoSlider">'+ 
      '<div class="">'+ 
       '<img id="" class="image mover" style="position:absolute;left:0px;top:0px;" src="http://localhost/gobiggi_VS_2_2/images/slideShow/slide01.jpg" data-thumb="images/slideShow/thumb/slide01.jpg" alt="" />'+ 
      '</div>'+ 
      '<div class="">'+ 
       '<img id="" class="image mover" style="position:absolute;left:0px;top:0px;" src="http://localhost/gobiggi_VS_2_2/images/slideShow/slide02.jpg" data-thumb="images/slideShow/thumb/slide02.jpg" alt="" />'+ 
      '</div>'+ 
      '<div class="">'+ 
       '<img id="" class="image mover" style="position:absolute;left:0px;top:0px;" src="http://localhost/gobiggi_VS_2_2/images/slideShow/slide03.jpg" data-thumb="images/slideShow/thumb/slide03.jpg" alt="" />'+ 
      '</div>'+ 
      '<div class="">'+ 
       '<img id="" class="image mover" style="position:absolute;left:0px;top:0px;" src="http://localhost/gobiggi_VS_2_2/images/slideShow/slide04.jpg" data-thumb="images/slideShow/thumb/slide04.jpg" alt="" />'+ 
      '</div>'+ 
     '</div>'+'<script>$("#slider").nivoSlider({effect: "sliceDown",animSpeed: 500,pauseTime: 3000,startSlide: 0,controlNavThumbs: true,controlNavThumbsFromRel:true, pauseOnHover: true,manualAdvance: false});</script>'; 

Znacznik skrypt na końcu kodu jest to, co staramy się dołączyć do HTML i zapisać go do database.We próbował mając pustą <div id="temp"></div> i dodanie znacznika script w nim, ale Wierzę, że jQuery wykonuje skrypt i nie zapisuje go, więc otrzymujemy pusty div.Jak można przechowywać tag skryptu w strukturze HTML i zapisać go w bazie danych?

Answer 1

Zamiast bezpośrednio zapisywać znacznik skryptu, należy go utworzyć jako obiekt, a następnie dołączyć do niego. Przeglądarka powinna ją respektować, gdy element zostanie utworzony bezpośrednio, zamiast przekazywać ciąg znaków.

var script = document.createElement("script"); 
script.type = "text/javascript"; 
script.src = "scriptname.js"; 
$("#temp").append(script); 

Następnie można po prostu umieścić skrypt który chcesz wykonać w pliku skryptu zewnętrznego i powinien działać dobrze