Question

我有一个页面上有一个表单。用户输入一个URL并将其发布到iframe目标。

我只想在用户提交表单时iframe正在加载新页面时显示加载动画。我不确定我做错了什么，但这是我的代码，如果有人可以提供帮助：

<head>
    <script type="text/javascript">
        function hideLoading() {
            document.getElementById('divLoading').style.display = "none"; 
            document.getElementById('divFrameHolder').style.display = "block"; 
        } 
    </script> 
</head>

<body>
    <div>
        <form id="form" method="post" target="my-iframe" convert.php">
            <input id="element_1" type="text" maxlength="255" value="http://"/> 
            <input id="saveForm" type="submit" name="submit" value="submit" />
        </form>
    <div>

    <div>
    <div id="divLoading"> 
        <img src="ajax-loader.gif" alt="" /> 
    </div> 

    <div id="divFrameHolder" style="display:none"> 
        <iframe id="my_frame" name="my-iframe" src="page.html" onload="hideLoading()"></iframe>
    </div>

</body>

Answer 1

你可以做一个技巧：在page.html附加事件访问者window.onload或DOMContentLoaded和fire parent.hideLoading()方法内。

例如。 page.html中：

document.addEventListener("DOMContentLoaded",function(){
     parent.hideLoading();
},false);

Answer 2

这里的例子是

jsbin

可能我觉得你的功能没有打电话。

iframe onload动画不起作用

2 个答案: