Ajax com jQuery

Publicado em 25 de Mar 2013.

Olá pessoal sempre eu esqueço de como fazer um função ajax, é uma coisa bem simples de se fazer, mas não consigo decorar, bom vamos ao nosso tutorial simples de como retornar um conteúdo dentro de uma div.

index.php

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <title>Exemplo de Ajax</title>
        <script type="text/javascript" src="../jquery.js"></script>
        <script type="text/javascript">

            function mostrar() {

                $.ajax({
                    url: "test.php?id=3",
                    cache: false,
                    success: function(data){
                        $("#texto").html(data);
                    }
                });
            }

        </script>
    </head>
    <body>
        <button onclick="mostrar()">Mostrar</button>
        <div id="texto"></div>
    </body>
</html>

Temos a nossa página principal está pagina contém uma função chamada mostrar() que faz um requisão para página test.php, isso ocorre quando clicado o botão Mostrar.

Agora vamos criar a página test.php

test.php

<?php 
    echo 'Estou dentro da Div';
?>