jquery html () удаляет теги скрипта - PullRequest
27 голосов
/ 02 ноября 2010

Мне нужно заменить содержимое div на моей странице html, полученным в результате вызова ajax. Проблема в том, что в html есть некоторые необходимые скрипты, и кажется, что функция jquery html () удаляет их, Мне нужно отфильтровать ответ и получить только определенный div.

Я подумываю об обходном пути, который заключается в извлечении всех тегов сценария из ответа ajax, а затем добавлении их в DOM, но у меня возникают проблемы при этом.

Вот мой код;

   $('a.link-vote').live('click',function(){
        var idfeedback = $(this).attr('id').split('-')[1];
        var href = $(this).attr('href');
        $('.feedback-' + idfeedback + '-loader').show();
        $.ajax({
            type: "POST",
            url: href,
            success: function(response){
               var x = $(response).find('#feedback-'+ idfeedback).html();
               $('.feedback-' + idfeedback + '-loader').hide();
               $('#feedback-'+ idfeedback).html(x);

            }
        });
        return false;
    });

Я нашел эту старую тему: jQuery - теги скрипта в HTML анализируются jQuery и не выполняются

но любой вывод. Я попробовал предложенные там решения, но ни одно из них не сработало.

EDIT: Кажется, я нашел обходной путь, основанный на этой старой теме, но он не очень хорош;

  var dom = $(response);
                // var x = $(response).find('#feedback-'+ idfeedback).html();
                $('.feedback-' + idfeedback + '-loader').hide();
                //$('#feedback-'+ idfeedback).html(x);

                $('#feedback-'+ idfeedback).html(dom.find('#feedback-'+ idfeedback).html());

                dom.filter('script').each(function(){
                    var obj = $(this);
                    $('#feedback-'+ idfeedback + ' .feedback-comments').append(obj);
                });

Должен быть легкий путь.

Ответы [ 5 ]

27 голосов
/ 03 ноября 2010

Редактировать: я устал и не думаю. Вы можете просто использовать собственный метод innerHTML вместо .html():

$('#feedback-' + idfeedback)[0].innerHTML = x;

Оригинальный ответ:

Я догадываюсь, что связанный с вами ответ не работает для вас, потому что включенные сценарии вызываются с атрибутом src вместо содержимого сценария между тегами <script> и </script>. Это может работать:

$.ajax({
    url: 'example.html',
    type: 'GET',
    success: function(data) {

        var dom = $(data);

        dom.filter('script').each(function(){
            if(this.src) {
                var script = document.createElement('script'), i, attrName, attrValue, attrs = this.attributes;
                for(i = 0; i < attrs.length; i++) {
                    attrName = attrs[i].name;
                    attrValue = attrs[i].value;
                    script[attrName] = attrValue;
                }
                document.body.appendChild(script);
            } else {
                $.globalEval(this.text || this.textContent || this.innerHTML || '');
            }
        });

        $('#mydiv').html(dom.find('#something').html());

    }
});

Обратите внимание, это не проверялось ни на чем и может съесть детей.

3 голосов
/ 16 декабря 2012

У меня была та же проблема, но с большим количеством проблем, которые я не мог так легко исправить.Но я нашел решение:

Это мой псевдоисточник (HTML), который я никак не мог изменить.

<html>
  <body>
    <div id="identifier1">
      <script>foo(123)</script>
    </div>
    <div id="identifier2">
      <script>bar(456)</script>
    </div>
  </body>
</html>

Я использовал $.get() чтобы получить эту страницу HTML.Теперь, когда у меня есть код в виде строки, пришло время искать его с помощью jQuery.Моя цель состояла в том, чтобы изолировать Javascript-код внутри тега <script>, который принадлежит DIV identifier2, но не identifier1.Итак, что я хотел получить - это bar(456) как строка результата.По той причине, что jQuery удаляет все теги скрипта, вы не можете искать больше так:

var dom = $(data); //data is the $.get() - Response as a string
var js = dom.filter('div#identifier2 script').html();

Решение - это простой обходной путь.В начале мы заменим все <script> -Tag на что-то вроде <sometag>:

var code = data.replace(/(<script)(.*?)(<\/script>)/gi, '<sometag$2</sometag>');
var dom = $(code);
var result = dom.find('div#identifier2 sometag').html(); 

//result = bar(456)

Это простой взлом, но он работает!

0 голосов
/ 27 февраля 2019

Это самое простое решение:

var keepScripts;
keepScripts = true;
$.parseHTML(yourHtmlString, keepScripts);

Это сохранит теги скрипта;)

0 голосов
/ 02 ноября 2010

Можете ли вы показать мне структуру HTML результата?

ОБНОВЛЕНИЕ 2010/11/03

Вы можете исключить тег <script> из .html() результата с помощью регулярного выражения.
Из вашего первого кода, после этой строки.

var x = $(response).find('#feedback-'+ idfeedback).html();

Вы можете сделать что-то подобное.

x = x.replace(/\n/g, '{n}')
.replace(/<script.*?<\/script>/g, '')
.replace(/{n}/g, '\n');
0 голосов
/ 02 ноября 2010

Попробуйте

$('#feedback-'+ idfeedback).empty().append(response);

Я не проверял. Не уверен, что .html() действительно полоски <script>, но попробуйте.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...