这样可以创建iframe吗?

时间:2014-06-17 11:25:17

标签: javascript php iframe

我想像这样创建iframe。但我做到了。

   <iframe>
    <html>
     <style>/* codes */</style>
     <script type="javascript">/* codes */</script>
    </html>
    <body>
     Welcome!!
    </body>
    </iframe>

PHP代码:

function prew($html, $css, $js) {
    $iframe .= '<iframe>';    
    $iframe .= '<html>';
    $iframe .= '<head>';
    $iframe .= '<style>' . $css . '</style>';
    $iframe .= '<script>' . $js . '</script>';
    $iframe .= '<script src="http://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>';
    $iframe .= '</head>';
    $iframe .= '<body>';
    $iframe .= $html;
    $iframe .= '</body>';
    $iframe .= '</html>';
    $iframe .= '</iframe>';
    return $iframe;
}

如果我使用它,它不起作用。为什么不工作? 如何创建我想要的iframe?我搜索了很多次但是我找不到任何关于这种情况的信息

1 个答案:

答案 0 :(得分:0)

您无法在PHP中直接回显<iframe>中包含其中的所有内容。他们必须与javascript并肩工作。在这个例子中,是#39;我使用jQuery。

Sample Output

<?php

// just the same as your code; construction of tags from PHP
function prew($html, $css, $js) {
    $iframe = '<html>';
    $iframe .= '<head>';
    $iframe .= '<style>' . $css . '</style>';
    $iframe .= '<script>' . $js . '</script>';
    $iframe .= '<script src="http://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>';
    $iframe .= '</head>';
    $iframe .= '<body>';
    $iframe .= $html;
    $iframe .= '</body>';
    $iframe .= '</html>';
    return $iframe;
}

// you client should request this
if(isset($_POST['get_contents'])) {
    // this is what you decide what you need to put inside, this is just a sample.
    echo prew('<div>hello world</div>', 'div{background-color: blue; width: 200px; color: white}', '');
    exit;
}

?>

<div class="contents"></div>
<button id="put_contents">Put contents</button>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    $('#put_contents').on('click', function(){
        $.ajax({
            url: 'index.php', // the name of the php (in this case, same page)
            data: {get_contents: true},
            type: 'POST',
            dataType: 'text',
            success: function(response) {
                // put the contents
                var $iframe = $('.contents').html('<iframe></iframe');
                $iframe.html(response);

            }
        });
    });

});
</script>