JavaScript弹出窗口CSS并单击功能

Question

I have a pop up window which contains form to fill out the details. My need is, I need to show the form inside the pop up window with the css styles applied to it.

Currently I have loaded the form inside the pop up window but it is not taking the style applied to it. How do I get the styles to be applied on it. (I don't want to load the .html page in windows pop up)

When I click on the submit link in the pop up, it should clone the .clone div on the page and pop up should get closed.

here is my current js

function myFunction() {
    var myWindow = window.open("", "MsgWindow", "width=500, height=400");
    myWindow.document.write($(".content").html());
    myWindow.document.close();
}

DEMO

Any help is much appreciated. Thank you!

Answer 1

put ur css inside the div ' content '

check this link http://jsfiddle.net/erv3ebj1/5/

Answer 2

Adding some like this may work

myWindow.append($("<link/>", 
    { rel: "stylesheet", href: "file://path/to/style.css", type: "text/css" }));

Answer 3

尝试在隐藏的iframe中打开它，直到需要它为止。

Answer 4

Put CSS under content div and use internal css <style> .

I would advice to use it before form tag

Demo

Answer 5

Please try this one:

function myFunction() {
    var myWindow = window.open("", "MsgWindow", "width=500, height=400");

    myWindow.document.write($(".content").html());

    myWindow.document.close();

    }

DEMO