Created
March 12, 2014 04:23
-
-
Save valdiney/9500808 to your computer and use it in GitHub Desktop.
Neste exemplo mostra como chamar o conteúdo de uma página para dentro de uma div assim que um botão seja clicado!!
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //////////////////////////////////////////////////////////////////////// | |
| // Projeto: Biblioteca ajax | |
| // Autor: Valdiney França | |
| // Email: Valdiney.2@hotmail.com | |
| ////////////////////////////////////////////////////////////////////// | |
| //////////////////////////////////////////////////////////////////////// | |
| ////////////////////////////////////////////////////////// | |
| // (Minha area) Guarda o ID da área onde vamos colocar o conteúdo via ajax... | |
| ///////////////////////////////////////////////////////// | |
| var minha_area = 'conteudo'; | |
| ////////////////////////////////////////////////////////// | |
| // Função carrega a imagem loader... | |
| ///////////////////////////////////////////////////////// | |
| function carregando(c) { | |
| while(c.hasChildNodes()) { | |
| c.removeChild(c.lastChild); | |
| } | |
| var img = document.createElement('img'); | |
| img.setAttribute('src', 'ajax-loader.gif'); | |
| c.appendChild(img); | |
| } | |
| ////////////////////////////////////////////////////// | |
| ///////////////////////////////////////////////////// | |
| // Função mostra na tela a requisição... | |
| //////////////////////////////////////////////////// | |
| function mostrar(ajax) { | |
| var cadastrar = document.getElementById(minha_area); | |
| cadastrar.innerHTML = ajax.responseText; | |
| } | |
| //////////////////////////////////////////////// | |
| /////////////////////////////////////////////// | |
| // Função faz a requisição dos dados... | |
| /////////////////////////////////////////////// | |
| function requisitar(url) { | |
| var ajax = iniciaAjax(); | |
| carregando(document.getElementById(minha_area)); | |
| ajax.onreadystatechange = function() { | |
| if(ajax.readyState == 4) { | |
| mostrar(ajax); | |
| } | |
| } | |
| ajax.open("POST", url); | |
| ajax.send(null); | |
| } // end requisitar url | |
| //////////////////////////////////////////// | |
| ///////////////////////////////////////////////////////////////////// | |
| // Função verifica qual tipo de objeto o navegador está utilizando... | |
| ////////////////////////////////////////////////////////////////////// | |
| function iniciaAjax() { | |
| var ajax = null; | |
| if(window.XMLHttpRequest) { | |
| ajax = new XMLHttpRequest(); | |
| } | |
| else if(window.ActiveXObject) { | |
| try { | |
| ajax = new ActiveXObject("Msxml2.XMLHTTP"); | |
| } | |
| catch(e) { | |
| ajax = new ActiveXObject("Microsoft.XMLHTTP"); | |
| } | |
| } | |
| return ajax; | |
| } // end iniciar ajax... | |
| ////////////////////////////////////////////////////////////////// | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Document</title> | |
| <script> | |
| window.onload = function() { | |
| var chamar_ajax = document.getElementById('chamar_ajax'); | |
| chamar_ajax.onclick = function() { | |
| requisitar("chama.html"); | |
| return false; | |
| } // end chama_ajax | |
| } // end window | |
| </script> | |
| </head> | |
| <body> | |
| <button type="button" id="chamar_ajax">Buscar</button> | |
| <div id="resposta"></div> | |
| <script src="js/core_ajax.js"></script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment