如何使用 Ajax 刷新 <iframe>？

Question

我想使用 AJAX 刷新此链接 http://radiojoven.6te.net/capas.php。我一直在尝试，但无济于事。这是我到目前为止所拥有的：

<script>
function checkRequest() {
    var interval = setTimeout(function () {
        $.ajax({
            url: "http://radiojoven.6te.net/capas.php",
            type: "post",
            datatype: "html"
        })
            .done(function (msg) {
            $("capas").html(msg);
        })
            .always(function () {
            checkRequest();
        });
    }, 20000);
}
</script>

我计划更新的 iframe：

<div id="capas"><iframe src="http://radiojoven.6te.net/capas.php"
     width="1000px" height="300px" border="0" marginwidth="0"
     marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no"></iframe></div>

如果有人能帮助我完成这项工作，我将不胜感激。

已经谢谢你了。

Answer 1

我建议将iframe 全部删除，只使用AJAX。

它从不更新的原因是capas div 没有被正确引用。

你需要$("#capas").html(msg); // 注意#是指元素的ID。

作为附加说明，您似乎没有向服务器发布任何数据，因此您最好使用HTTP GET 而不是HTTP POST。

Answer 2

它应该看起来像这样。请注意，我将您的 iframe 更改为 div

<script type="text/javascript">
function Ajax(){
var xmlHttp;
    try{    
            xmlHttp=new XMLHttpRequest();
    }
    catch (e){
            try{
                    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); 
                   }
            catch (e){
                try{
                            xmlHttp=newActiveXObject("Microsoft.XMLHTTP");
                    }
                    catch (e){
                            alert("No AJAX!?");
                            return false;
                    }
            }
    }

xmlHttp.onreadystatechange=function(){
        if(xmlHttp.readyState==4){
            document.getElementById('capas').innerHTML=xmlHttp.responseText;
            setTimeout('Ajax()',10);
    }
 }
            xmlHttp.open("GET","http://radiojoven.6te.net/capas.php",true); 
     // aqui configuramos o arquivo
     xmlHttp.send(null);
 }

     window.onload=function(){
          setTimeout('Ajax()',10); 
       // aqui o tempo entre uma atualização e outra
     }
     </script>

     <div id="capas"></div>