Página com 'iframe' em ajax

O Jeison Frasson escreveu (ou copiou) isso no dia 21/05/2009 Voltar

Quando passei ajax para meus alunos todos ficaram espantados pois a página almentava, aparecia loading..., em fim fora eles varios me pedirão para postar um artigo sobre, e segue a baixo ^^

No caso sua página sejá em php inicie assim:

<?php header('Content-Type: text/html; charset=ISO-8859-1',true); ?>

<?php header('Content-Type: charset=UTF-8'); ?>

Começando pra valer:

<html>
    <head>
        <title> teste </title>
        <script type="text/javascript">
            function ajaxInit() {
                var xmlhttp;

                try {
                    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                } catch (e) {
                    try {
                        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
                    } catch (E) {
                        xmlhttp = false;
                    }
                }

                if (!xmlhttp && typeof XMLHttpRequest != 'undefined' ) {
                    try {
                        xmlhttp = new XMLHttpRequest();
                    } catch (e) {
                        xmlhttp = false ;
                    }
                }
                return xmlhttp;
            }


            function url_encode(str) {
                var hex_chars = "0123456789ABCDEF";
                var noEncode = /^([a-zA-Z0-9_-.])$/;
                var n, strCode, hex1, hex2, strEncode = "";

                for(n = 0; n < str.length; n++) {
                    if (noEncode.test(str.charAt(n))) {
                        strEncode += str.charAt(n);
                    } else {
                        strCode = str.charCodeAt(n);
                        hex1 = hex_chars.charAt(Math.floor(strCode / 16));
                        hex2 = hex_chars.charAt(strCode % 16);
                        strEncode += "%" + (hex1 + hex2);
                    }
                }
                return strEncode;
            }

            // url_decode version 1.0
            function url_decode(str) {
                var n, strCode, strDecode = "";

                for (n = 0; n < str.length; n++) {
                    if (str.charAt(n) == "%") {
                        strCode = str.charAt(n + 1) + str.charAt(n + 2);
                        strDecode += String.fromCharCode(parseInt(strCode, 16));
                        n += 2;
                    } else {
                        strDecode += str.charAt(n);
                    }
                }

                return strDecode;
            }
            function getSecoes(pagina,layer) {
                document.getElementById(layer).innerHTML = "Carregando";
                ajax = ajaxInit();
                //aqui estão as propriedade que puxão sua página//
                ajax.open("GET",pagina+".html", true);
                ajax.onreadystatechange = function() {
                    if(ajax.readyState == 4 && ajax.status == 200) {
                        var resultado = ajax.responseText;
                        resultado=resultado.replace(/+/g," ");
                        resultado = unescape(resultado);
                        document.getElementById(layer).innerHTML = url_decode(resultado);
                    }
                }
                ajax.send(null);
            }

        </script>
        <!-- aqui estão as propriedades do div ou seja largura e altura e posição -->
        <style type="text/css">
            #resultado{
                position:relative;
                float:left;
                overflow:auto;
                width:500px;
            }
        </style>
    </head>
    <body>
        <a href="#" onclick="getSecoes('pagina','resultado')"> clique aqui </a>
        <div id="resultado"> </div>
    </body>
</html>

// pagina.html isso é só para teste tá

<h1>ola mundo!!</h1>

// na pagina.htm somente o conteudo, pois sera inserida dentro da pagina principal por ajax

para iniciar carregando a pagina no div,

mude o <body> para <body onload="getSecoes('pagina','camada')">

Página com 'iframe' em ajax

Comentar