JQuery html() удаляет теги script
Мне нужно заменить содержимое div на моей странице на html, полученный из вызова ajax.
Проблема в том, что html содержит в себе некоторые необходимые скрипты, и кажется, что функция jquery html() выделяет их,
Мне нужно отфильтровать ответ и получить только определенный div.
Я думаю об обходном пути, который заключается в том, чтобы извлечь все теги script из ответа 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 - script теги в 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);
});
Должен быть простой способ.
Ответы
Ответ 1
Изменить: Я устал и не думаю. Вы можете просто использовать собственный innerHTML
метод вместо .html()
:
$('#feedback-' + idfeedback)[0].innerHTML = x;
Оригинальный ответ:
Моя догадка заключается в том, что ответ, который вы связали, не работает для вас, потому что включенные сценарии вызываются с атрибутом src
, а не script между тегами <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());
}
});
Обратите внимание, что это нигде не проверялось и может есть младенцев.
Ответ 2
У меня была та же проблема, но с большим количеством проблем, которые я не мог легко исправить.
Но я нашел решение:
Это мой псевдо-источник (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>
-Tag, который принадлежит DIV identifier2
, но не к identifier1
. Так что я хотел получить bar(456)
как строку результата.
По причине, что jQuery разбивает все script -Tags, вы не можете искать больше:
var dom = $(data); //data is the $.get() - Response as a string
var js = dom.filter('div#identifier2 script').html();
Решение является простым обходным решением. Вначале мы заменим все <script>
-Tags на что-то вроде <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)
Это простой взлом, но он работает!
Ответ 3
Try
$('#feedback-'+ idfeedback).empty().append(response);
Я не тестировал. Не уверен, что .html()
действительно разделит <script>
, но попробуйте.
Ответ 4
Вы можете показать мне структуру 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');