Geek asks and answers

Dynamic iframe in popup

I am trying to achieve two things using the href links below. Firstly, I would like to launch a popup. Done. Then I would like this popup to display an iframe. This was easily achieved before . I realized that I need to pass the href link text as a parameter in my iframe src.

So, for example, an iframe does not load in my popup if its src="http://localhost:8080/test/document.html?OnSale"

I can’t understand why the document.writedynamic iframe Im trying to create foo () in href links with my function will not print in the body of my html page ...

<div id="blanket" style="display:none;"></div>
    <div id="popUpDiv" style="display:none;">
        <a href="#"  onclick="popup('popUpDiv')">
            <img align="right" src="http://localhost:8080/test/img/close_img.png">
        </a>
<script type="text/javascript"> 
    function foo(obj)
    {
        test1 = "http://localhost:8080/test/document.html?"+obj.text; 
        document.write('<iframe height="450"  allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+test1+'" type= "text/javascript"></iframe>');
    } 
</div>

<a href="#" onclick="popup('popUpDiv');foo(this);">OnSale</a>

EDIT: Here is my full html page. Everything works locally on tomcat7 w / win7 and firefox.

<html>
<head>
    <script type="text/javascript" src="http://localhost:8080/test/css-popup/css-pop.js"></script>
    <link href="http://localhost:8080/test/css-popup/styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="blanket" style="display:none;"></div>
<div id="popUpDiv" style="display:none;">
    <a href="#"  onclick="popup('popUpDiv')">
        <img align="right" src="http://localhost:8080/test/css-popup/x.png">
    </a>
    <script type="text/javascript">
        function foo(obj){
            test1 = "http://localhost:8080/test/document.html?"+obj.innerHTML;
            document.write('<iframe height="450"  allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+test1+'" type= "text/javascript"></iframe>');

        }
    </script>
</div>

<a href="#" onclick="popup('popUpDiv');foo(this);">OnSale</a>
</body>
</html>
+3
source share
1

text , innerHTML ,

function foo(obj){
     test1 = "http://localhost:8080/test/document.html?"+obj.innerHTML; 
     document.write('<iframe height="450"  allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+test1+'" type= "text/javascript"></iframe>');
}

, ,

, iframe. document.write . , . .

,

<html>
<head>
<script type="text/javascript" src="http://localhost:8080/test/css-popup/css-pop.js"></script>
<link href="http://localhost:8080/test/css-popup/styles.css" rel="stylesheet" type="text/css" />
</head>
<body>


<div id="blanket" style="display:none;"></div>
    <div id="popUpDiv" style="display:none;">
        <a href="#"  onclick="popup('popUpDiv')">
            <img align="right" src="http://localhost:8080/test/css-popup/x.png">
        </a>
<script type="text/javascript"> 
    var popUpWindow;
    function popup(n) {
       popUpWindow = window.open(n);
    }
                function foo(obj){
                test1 = "http://localhost:8080/test/document.html?"+obj.innerHTML; 
                popUpWindow.document.write('<iframe height="450" allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+test1+'" type= "text/javascript"></iframe>');

                } 
        </script>
</div>

        <a href="#" onclick="popup('popUpDiv');foo(this);">OnSale</a>

</body>
</html>​

live DEMO

+3

More articles:


All Articles