1. java
  2. android
  3. c#
  4. .net
  5. javascript
  6. php
  7. jquery
  8. html
  9. sql

Como carregar uma pagina dentro de uma DIV utilizando AJAX e xmlRequest e fazendo o JS da pagina carregada funcionar?

Olá, eu estou desenvolvendo uma pagina web que contém um menu lateral e uma div central. Quando o usuário clica na opção do menu, carrega uma nova pagina na div central. A pagina que está sendo carregada normalmente, porém o JavaScript da pagina não. Pelo que entendi, a função "responseText" trata toda a pagina como texto puro e por isso não carrega o JS da pagina. Gostaria de saber de um jeito de carregar essa pagina dentro da div e fazer com que o arquivo JS da pagina funcione. PS: O método load está defasado e não permite carregar a pagina.

Abaixo segue o código da pagina dashboard (que contem o menu e a div que carrego a pagina):


     // script para carregar pagina dentro da div dashboard
     function GetXMLHttp() {
      if(navigator.appName == "Microsoft Internet Explorer") {
       xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
   }
   else {
    xmlHttp = new XMLHttpRequest();
}
return xmlHttp;
}

var xmlRequest = GetXMLHttp();

function abrirPag(valor){
    var url = valor;

    xmlRequest.open("GET", url, true);
    xmlRequest.onreadystatechange = mudancaEstado;
    xmlRequest.send(null);

    if (xmlRequest.readyState == 1) {
        document.getElementById("conteudo").innerHTML = "<img id='gif_loader' src='img/loader.gif'>";
    }

    return url;
}

function mudancaEstado(){
    if (xmlRequest.readyState == 4){
        document.getElementById("conteudo").innerHTML = xmlRequest.responseText;
    }  
}

    // abre tela de inicio primeiro na dashboard
    abrirPag("inicio.html");

    // função que carrega a pagina inicial na div conteudo
    $("#opc_home").click(function(){
    // fechar menu mobile
    $("header").removeClass("open-menu");
    // abre conteudo dentro da div
    abrirPag("inicio.html");
});

    // função que carrega a pagina de resumo das movimentações na div conteudo
    $("#opc_movimentacoes").click(function(){
    // fecha menu mobile
    $("header").removeClass("open-menu");
    // abre conteudo dentro da div
    abrirPag("resumo_movimentacoes.html");

});

Agradeço se alguém puder me ajudar.

  1. Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
  2. Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
  3. Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
  4. Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
  5. Clique aqui para mais detalhes sobre o funcionamento do GUJ!

0 resposta

Não é a resposta que estava procurando? Procure outras perguntas com as tags javascript ajax jquery ou faça a sua própria pergunta.