Добавьте / добавьте тег<script>в html, используя javascript / jquery

Question

Вариант использования: я работаю над приложением для создания шаблонов. Пользователь может создавать HTML-шаблоны, используя различные компоненты, такие как текстовое поле, графическое окно, слайд-шоу и т. Д.

Проблема: проблема, с которой мы сталкиваемся, связана с компонентом слайд-шоу. Для его создания мы используем плагин nivoslider. У слайдера должны быть такие настройки, как пользователь может изменять время перехода, выбирать переход и т. Д. Пользователь может добавить больше, чем слайд-шоу.
Теперь проблема в том, что когда мы добавляем несколько слайд-шоу, у каждого из них могут быть свои параметры, поэтому у нас не может быть общей функции. Также пользователь может вернуться для редактирования шаблона, поэтому нам необходим независимый скрипт для каждого слайд-шоу.,

Исследование: у нас есть базовая структура, работающая, но застрявшая в одном месте. Нам нужно добавить script тег для каждого слайд-шоу, добавленного на страницу пользователем.

    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>';

Тег скрипта в конце кода - это то, что мы пытаемся добавить в HTML и сохранить его в базе данных. Мы попытались получить пустой <div id="temp"></div> и добавив в него тег script, но я верю jQuery выполняет скрипт и не сохраняет его, поэтому мы получаем пустой div. Как мы можем сохранить тег скрипта в структуре HTML и сохранить его в базе данных?

Answer 1

Вместо того, чтобы записывать тег сценария напрямую, создайте его как объект, а затем добавьте его. Браузер должен уважать его, когда вы создали элемент напрямую, а не передавать ему строку.

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

Затем вы можете просто поместить javascript, который вы хотите выполнить, во внешний файл скрипта, и он должен работать нормально