2013-12-18 4 views
0

Вот мой код: (Jquery)Jquery плагин не работает после того, как AJAX OnChange

<script src="./minified/jquery.sceditor.bbcode.min.js"></script> 
     <script>   var loadCSS = function(url, callback){ 
       var link = document.createElement('link'); 
       link.type = 'text/css'; 
       link.rel = 'stylesheet'; 
       link.href = url; 
       link.id = 'theme-style'; 

       document.getElementsByTagName('head')[0].appendChild(link); 

       var img = document.createElement('img'); 
       img.onerror = function(){ 
        if(callback) callback(link); 
       } 
       img.src = url; 
      } 
      $(document).ready(function() { 
       var initEditor = function() { 
        $(".new_text").sceditor({ 
         plugins: 'bbcode', 
         style: "./minified/jquery.sceditor.default.min.css" 
        }); 
       }; 

       $("#theme").change(function() { 
        var theme = "./minified/themes/" + $(this).val() + ".min.css"; 

        $(".new_text").sceditor("instance").destroy(); 
        $("link:first").remove(); 
        $("#theme-style").remove(); 

        loadCSS(theme, initEditor); 
       }); 

       initEditor(); 
      }); 

     </script> 

Этот код не работает после того, как Ajax на функции изменения. Мой HTML-код здесь: Вот Аякс ответ:

<div id="txtHint" style="margin-left: 160px;"> 
<textarea class="new_text" name="about_builder" id="about_builder" style="height:200px;width:600px;"> 
<?php echo $row_ab['about_builder']; ?> 
</textarea></div> 

Проблема в том, после того, как AJAX, что область текста плагин не работал.

+0

Что вы имеете в виду под "Этот код не работает после того, как Ajax на функцию изменения? Что вы ожидаете, что произойдет? есть ли ошибка? –

+0

Вам нужно связать свой 'sceditor' снова после вызова ajax или использовать делегирование, чтобы убедиться, что новые добавленные элементы связаны автоматически. – jeroen

+0

Да, sceditor работал перед ajax. но после того, как ajax sceditor не работал. только текстовая область показывала –

ответ

1

Вы должны всегда звонить .sceditor, когда вы добавляете новый html с помощью ajax. Вы также должны изменить функцию, чтобы вызвать sceditor только только что добавленный элемент.

var initEditor = function(context) { //Add a context parameter to search only from this context 
    $(".new_text",context).sceditor({ 
      plugins: 'bbcode', 
      style: "./minified/jquery.sceditor.default.min.css" 
      }); 
    }; 

Ваш Аякса функция выглядит следующим образом:

$.ajax({ 
    // 
}) 
.done(function(data){ 
    yourContainer.html(data); //When you load the html, you need to insert it into the DOM 
    initEditor(yourContainer);//call the sceditor on the newly added element. 
}); 
+0

Я не получаю ваш метод @Khanh –

+1

@ user3115202: Когда вы добавляете html из ajax, вам нужно вызвать '.sceditor' для этого нового html –

Смежные вопросы