我正在尝试开发一个jquery脚本,当您将鼠标悬停在表td上时将打开一个包含该网页的弹出窗口,并在移开它时将其关闭。到目前为止,它运行良好。我的代码是:
var html = "";
var $that = "";
var $url = "";
$('td').hover(function() {
var contents = $(this).html();
if (contents.match("^http")) {
console.log('contents', contents);
$that = $(this);
$url = contents;
$.ajax({
type: "POST",
url: "/echo/html/",
context: $that,
data: {u: 'http://stackoverflow.com'},
dataType: 'html',
error: function(jqXHR, textStatus, errorThrown) {
console.log('error');
console.log(jqXHR, textStatus, errorThrown);
}
}).done(function(html) {
console.log(' here is the html ' + html);
html = '<ul class="nav"><li><a href="#">hola</li><li><a href="#">hola2</li></ul>';
$link = $('<a href="myreference.html" class="p1" data-html="true" data-bind="popover">');
$link.data('content', html);
$(this).html($link);
$that = $(this);
// Trigger the popover to open
$link = $(this).find('a');
$link.popover("show");
})
};
}, function() {
console.log('this2 ', $that);
$link = $that.find('a');
console.log('$link2 ', $link);
$link.popover("hide");
$that.html($url);
});
您可以在以下位置看到它:
JSFiddle
问题是通过ajax请求将网页插入到弹出窗口中引起的。您可以看到如果删除该行会发生什么:
html = '<ul class="nav"><li><a href="#">hola</li><li><a href="#">hola2</li></ul>';
它不再起作用。我在做什么错,并且鉴于in中所有不可预测的js,是否有可能将整个网页加载到弹出式窗口中?
最佳答案
我认为这确实与js有关。如果您使用以下方法过滤掉js:
html = html.replace(/<script[^>]*>[\s\S]*?<\/script>/gi, '');
它开始工作。