Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Já tentei de N maneiras utilizar o método $.ajax() do jQury, infelizmente sem sucesso, pois ao executá-lo a pag2.html que tem apenas tags simples(h1, h2 e p) é carregada da div#resultado como uma página completa(desde o 1º html até o /html), ou seja o site é carregado todinho na #resultado. Por que isso acontece? Lembro que com o método load() também ocorre isso porém o load() tem a opção de restringir o conteúdo de uma div por exemplo, tem como fazer isso com o $.ajax()?
já tentei usando this.append(data), this.html(data), this.text(data) e até refiz a função usando o .live() mas não obtive sucesso. Não dá erro algum no console do Chrome e do FF e por mais incrivel que pareça depois que eu comecei a usar o .live() ficou funcionando até os links e outros códigos da jQuery de dentro das páginas, porem o fato de sempre carregar todo o html dentro da div além de estragar o layout torna o código muito lento.
Eu uso a vesão 1.6.4 do jQuery.
Segue os códigos de que eu usei para os testes:
index.php
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Página de teste</title>
<script type="text/javascript" src="jquery-1.6.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function (){});
</script>
<style type="text/css"></style>
</head>
<body>
<div id="menuzinho">
<ul>
<li><a href="?pagina=home.php">Principal</a></li>
<li><a href="?pagina=pag2.php">Página 2</a></li>
<li><a href="?pagina=pag2.html">Página HTML</a></li>
</ul>
</div>
<div id="conteudo">
<?php
if(!$pagina){
include('home.php');
}else{
include($pagina);
}
?>
</div>
</body>
</html>home.php, pag2.php e pag2.html, só mudei o H1 e h2 de cada página
<h1>Home</h1>
<h2>Página Home</h2>
<?php echo "<h3>O valor de $pagina é: <strong class=\"lista\">".$_GET['pagina']."</strong></h3>";?>
<p>Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! Meu conteúdo vai ficar todo aqui! </p>Codigo 1
$("a").live('click', function(event) {
event.preventDefault(); success: function(data){
this.html(data);
}
});
});var conteudo = $('#conteudo');
$('a').live('click', function( e ){
e.preventDefault();
var links = $( this ).attr('href');
//alert ( links );
$.ajax({
url: links,
dataType: 'html',
success: function( response ){
conteudo.html( response );
console.log(response);
},
error: function(response){
console.log(response);
if ( response.status == 404 ) {
conteudo.html('Houve um erro: ' + response.status + ' ' + response.statusText);
}else if ( response.status == 403 ) {
conteudo.html('Sem permissão para acessar o arquivo.');
}else{
conteudo.html('Erro: ' + response.status + ' - ' + response.statusText+ ' ao tentar acessar');
}
}
});
});$('a').click(function(){
$.ajax({
//url que enviaremos
url : $( this ).attr('href'),
//aqui colocamos o callback na div #retorno
success : function(retorno){
$(#conteudo).html(retorno);
},
//veja se teve erros
error : function(retorno){
console.log(retorno);
}
});
});Codigo de exemplo da api com algumas modificações
$.ajax({
url: $( this ).attr('href'),
context: $(#conteudo),
success: function(){
$(this).html();
}
});Alguém sabe o(s) motivos e principalmente a solução para esses problemas?
Desde já eu agradeço!
Carregando comentários...