不可能链接样式表与window.open没有url参数

在关闭jQuery对话框时，我使用$ .ajax调用从服务器检索数据。在回电，我通常的方式将返回的数据的功能，像这样：不可能链接样式表与window.open没有url参数

success: function (result) { displayPage (result);}

该功能是指在弹出窗口中显示的参数数据，并通过其他的jQuery管理这些连同命令CSS样式表：

function displayPage (result) // analytical comments included 
{ 
    // (1) this block does not work: testPage shows, not writing occurs----------- 
/* 
    var myWindow = window.open('../innout/testPage.php', "_blank", "height=1000, width=1300,top=50,left=150"), 
     myPage = myWindow.document.body, 
     txt = 'some Text'; 

    $('#div1', myPage).html (txt);// neither this is operative… 
    myPage.write (txt); // nor this 
    */ 

    // (2) this block works, but no structure, no style sheets: ----------------- 
    /* 
    var myWindow = window.open('', "_blank", "height=1000, width=1300,top=50,left=150"), 
     myPage = myWindow.document.body, 
     txt = 'some Text'; 

    myWindow.document.write (txt); 
    */ 

    // (3) this block works, but SYNCHRO problem: ----------------- 

    var myWindow = window.open('', "_blank", "height=1000, width=1300,top=50,left=150"), 
     myPage = myWindow.document.body, 
     txt = 'some Text', 
     pageStruct = "<html>" 
        + "<head><meta charset='utf-8'><title>Landscape</title></head>" 
        + "<body bgcolor='pink'><div id='div1'</div></body>" 
       // or + "<body style='background-color: pink'><div id='div1'</div></body>" 
        + "</html>", 
     styleLinks = "<link rel='stylesheet' type='text/css' href='../innout/DossierCSS/globalRules.css'>"; 

     // Let's try now to link style sheets: 

     $(styleLinks).appendTo(myPage); // INEFFECTIVE 
      // or: 
     $(styleLinks).appendTo(myWindow.document.head); // INEFFECTIVE 
     // What about this? http://stackoverflow.com/questions/2685614/load-external-css-file-like-scripts-in-jquery-which-is-compatible-in-ie-also 
     $("<link/>", 
     { 
      rel: "stylesheet", 
      type: "text/css", 
      href: "../innout/DossierCSS/globalRules.css" 
     }).appendTo("head") // INEFFECTIVE. Also tried: (myWindow.document, "head") 

     $(pageStruct).appendTo(myPage); // works 

     $(myPage).attr ('bgcolor', 'pink'); // without it, 'original' bgcolor attribute inoperative ! 

     $('#div1', myPage).toggleClass ('violet');// INEFFECTIVE — .violet defined in globalRules.css as color:purple 

     $('#div1', myPage).css ({"color": "purple" }); // works 

     $('#div1', myPage).html (txt); // works 
}

我的第一种方法是通过window.open一个URL，即testPage.php -a很简单：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Landscape</title> 
</head> 

<body bgcolor="pink"> 
    <div id="div1"></div> 
</body> 
</html>

方式（1）允许ñ写作，而方式（2）和（3）。

方式（3）似乎令人满意，但它不是：我无法将CSS样式表链接到页面。我试图不采用两种不同的方法，其中之一在国有企业职位（引用）中有详细介绍。此外，在pageStruct级别添加内嵌样式或html格式是无效的。

看来<link>指令不能传递到<head>，因为文件头已经发送。通过方式（1），'修改'指令在后台短暂闪烁，然后被testPage.php内容覆盖：显然，window.open的处理发生在之后其余代码：同步问题！

注意：a）我也尝试用setTimeOut -unsuccessfully延迟DOM修改指令; b）我不能在要加载的页面中定义静态结构，因为我必须处理动态元素。

那么我怎样才能以良好的同步链接我的样式表？

来源

2016-08-02 Brice Coustillas

我会给它一个回去找回你。谢谢。 –

这实际上是发生故障的原因。1）如果您愿意，我建议您删除您的评论，并将其重新发布为正式答案：我将对其进行投票，并可以帮助其他SO用户;无论如何，如果你不愿意，我会投票给你的评论。 2）如果您对兼职工作机会感兴趣，请告诉我如何与我联系，我将向您发送更多详情。 –

;-)很高兴它帮助。正如你在我的评论中可能已经注意到的，我现在没有太多的时间来写出正式的答案，但我会在晚上。对于兼职工作，我没有时间的原因是我有一个全职工作，所以我会好好拒绝这个:-) – Kaiido

你的问题不是你如何在新文档中添加样式表（应该在<head>顺便说一句），但它的href属性。

目前，您已将其设置为"../innout/DossierCSS/globalRules.css"，这是一个“相对URI”，它是相对于当前document.baseURI路径。

你既然在window.open()的URL参数设置为_blank，新文档的baseURI将被默认设置为about:blank。然后，当转换为绝对网址时，您的相对网址会指向一个无效的网址。

的解决方案是要么你<style>的href属性设置为绝对URL（"http://yoursite.net/innout/DossierCSS/globalRules.css"）或使用<base>元件，以其href属性设置为"http://yoursite.net/someDirectory/"。
此后面的方法会将文档的baseURI设置为其href属性的值，从而使所有相对URL都与此新URL相关。请注意，它应放在文档之前的任何其他元素指向一个外部资源。

来源

2016-08-02 11:57:34 Kaiido

不可能链接样式表与window.open没有url参数

回答

相关问题