Javascript 打开弹出窗口时加载代码

Javascript 打开弹出窗口时加载代码,javascript,jquery,css,popup,styles,Javascript,Jquery,Css,Popup,Styles,我需要在加载弹出窗口时加载一些代码JS。我试过: mypopup.ready(function... 但什么都没有 这是我的密码 function popup(){ mypopup = window.open('http://33bits.es/foro/masiconos.php', 'popup', 'width=400','height=300','status=no', 'scrollbars=yes', 'toolbars=no', 'menubar=no', 'locat

我需要在加载弹出窗口时加载一些代码JS。我试过:

mypopup.ready(function...
但什么都没有

这是我的密码

  function popup(){
   mypopup = window.open('http://33bits.es/foro/masiconos.php', 'popup', 'width=400','height=300','status=no', 'scrollbars=yes', 'toolbars=no', 'menubar=no', 'location=no');

}

 $('#mas').click(function(evt) { popup();  });

mypopup.ready(function() {


//Más Iconos
$('img').click(function (evt) {
   var clase =  $(this).attr('class');
   insertar_popup(clase);
});
$('.cerrar').click(function(evt) { window.close(); });


//Mas Iconos CSS
$('.cerrar').css("font-family", "Arial");
$('.cerrar').css("cursor", "pointer");
$('.cerrar').css("margin", "50%");
$('.pop').css("background", "url(http://www.33bits.es/foro/Themes/epic_2_0/images/id/abgg.png)");
$('.iconos_pop > img').css("margin", "5px");
$('.iconos_pop > img').css("cursor", "pointer");
$('.iconos_pop').css("border-radius", "10px");
$('.iconos_pop').css("padding", "10px");
$('.iconos_pop').css("background", "white");
$('.iconos_pop').css("margin", "5% auto");
$('.iconos_pop').css("width", "95%");
});

我想加载弹出窗口,然后,加载我代码的这一部分,它会给弹出窗口带来风格。但是它没有加载,而且我的弹出窗口没有样式,它看起来是空的和破旧的。

这是因为你不能在弹出窗口中编辑你请求的另一个网页的样式。如果可能的话,这将是一个安全问题

如果“”是您自己的页面之一,您可以编辑并使用它


document.ready to do the styleing

您的问题的潜在解决方案可以是使用jQuery对话框。它显示了要在打开对话框时加载样式的代码,但使用jQuery对话框可以直接使用CSS设置样式。按照下面的链接查看示例,以及初始化它的源代码

基本设置使用jQuery表示法,您可以在html页面中创建一个对话框,并向其中添加一个“dialog”类:

$(function(){
    $("#yourDialog").dialog();
})
现在,要在单击链接时将其打开,您需要向代码中添加一些选项,使其在默认情况下不会打开,并且仅当您单击激活它的按钮时才会打开:

Javascript

$(function(){
    $("#yourDialog").dialog({
        autoOpen: false 
    });

    $("#yourButton").click(function(){
       $("#yourDialog").dialog("open");
    });
})
Html

<div id="yourDialog" title="Basic dialog">
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<button id="yourButton">Button</button>

这是用于显示信息的默认对话框。可以使用“x”图标移动、调整和关闭对话框窗口

按钮

有关更完整的示例,请访问链接。

因为您正在修改主页中DOM元素的属性,而不是弹出窗口

此外,当您尝试调用其
ready
方法时,不会设置
mypopup
变量。您可以尝试以下方法:

function popup() {
  var mypopup = window.open('http://33bits.es/foro/masiconos.php', 'popup', 'width=400', 'height=300', 'status=no', 'scrollbars=yes', 'toolbars=no', 'menubar=no', 'location=no');

  mypopup.onload = function() {
      var doc = mypopup.document,
          $popDocument = $(doc);

      // Everything you want
      $popDocument.find('.popClass').click(function() {
        alert('Hey you clicked in the popup!');
      });
  };
}

$('#mas').click(popup);
在行动中看到它:

请注意,您不应该像
$('selector')
那样操作弹出窗口的内容,因为它将在您的主页中搜索。相反,在上面的示例中,执行
$popDocument.find('selector')


下面是一个很好地将弹出窗口包装到对象中的答案:

注意,OP要求的是弹出操作,而不是对话框。这些建议很好,但是应该作为问题的评论来写。谢谢你的评论。我本来会留下评论的,但遗憾的是,我还没有找到所需的代表来发表评论它不适合我:(函数popup(){var mypopup=window.open(“”,'popup','width=400','height=300','status=no','scrollbars=yes','toolbars=no','menubar=no','location=no');mypopup.focus;$popDocument=$(mypopup.document);$popDocument.ready(函数(){//MáIconos$popDocument.find('img')。单击(函数(evt){var clase=$(this).attr('class');insertar_popup(clase);});仍然像以前一样。好吧,要让它真正起作用并不是那么容易。受我链接的另一篇文章的启发,我会编辑我的帖子谢谢@blint,当你有新的东西时让我知道。我一直在想:DDone。事实上,这很容易;-)但是我们必须严格控制这些操作。请注意,在plnkr中,为了测试目的,我在一个空的弹出窗口中添加了一些内容。在您的情况下,您只需在
mypopup.onload
函数中写入逻辑/css更改。但是我有另一个问题,我有两个单击函数不起作用。我有一个没有o单击“关闭”一词关闭弹出窗口还有一个是点击图标并在主窗口的文本区域添加一些文本。这里有这些功能的代码:非常感谢。如果你解决了这个问题,我将为你建立一个金像xDI我认为你不能使用javascript将样式应用于另一个网页。这意味着你可以从该网站发送和接收cookiesge也会给你未经授权的访问权。这里已经解决了:但我有一些新问题,你能帮我吗?:)