1

で iframe を使用testしていtest.htmlます。別のtest2.htmlファイルがその iframetestにロードされます。.で使用される変数にアクセスする必要がありますtest2.html。でそれにアクセスする方法はありますかtest.html。

ここに私のサンプルがあります

test.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link href="Styles/redmond/jquery-ui-1.10.3.custom.css" rel="stylesheet" />
    <script src="Js/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="Js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function(){
           //this code is doesn't work
           var data1= document.getElementById('test').contentWindow.document.data;
        });
    </script>
    <style type="text/css">
        body,html{
            height:100%;
            width:100%;
            top:0;
            left:0;
            overflow:auto;
        }
        #test{
            height:250px;
            width:250px;
            border:1px solid gray;
        }
    </style>
</head>
<body>
    <iframe id="test" src="test2.html"></iframe>
</body>
</html>

test2.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link href="Styles/redmond/jquery-ui-1.10.3.custom.css" rel="stylesheet" />
    <script src="Js/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="Js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>
    <script type="text/javascript">
        var data = 'This data is retrived from test2.html';
        $(document).ready(function () {
            $('#div')[0].textContent = data;
        });
    </script>
    <style type="text/css">
        body,html{
            height:100%;
            width:100%;
            top:0;
            left:0;
            overflow:auto;
        }
        #div{
            height:50px;
            width:200px;
            border:1px solid gray;
            margin:10px;
        }
    </style>
</head>
<body>
    <div id="div">Hello</div>
</body>
</html>

任意の提案をいただければ幸いです...！

4

1 に答える 1

1

前述のように、変数はcontentWindowではなくから取得する必要がありますcontentWindow.document。また、iframe が読み込まれるまで待つ必要がある場合もあります。

$(document).ready(function(){
     $('#test').on('load',function(){           
          var data1 = $('#test').get(0).contentWindow.data;
          // Or plain JavaScript
          // var data1 = document.getElementById('test').contentWindow.data;
     });
});
于 2013-09-11T09:41:16.663 に答える