DIv con contenuti dinamici

frengo

Nuovo Utente
16 Mar 2016
5
0
0
Salve a tutti il mio problema è questo:
ho un sito web nel quale tramite un link devo cambiare il contenuto di un div,quando clicco sul link appare un'immagine di loading e poi appare il contenuto deisderato. Il codice che ho funziona ma solo su firefox mentre su chrome ricarica il lo stesso contenuto io sotto metto il codice usato e la parte di html che lo riguarda spero riusciate ad aiutarmi,grazie in anticipo


HTML:
<div id="wrapper">
		<!--Parte statica-->
		<div id="nav">
			<!--<div class="row">
				<div class="col-sm-10  col-sm-offset-2">-->
					<ul>
						<li><a href="bootstrap.html">GEN</a></li>
						<li><a href="ciao.html">FEB</a></li>
						<li><a href="ciao.html">MAR</a></li>
						<li><a href="ciao.html">APR</a></li>
						<li><a href="ciao.html">MAY</a></li>
						<li><a href="ciao.html">JUN</a></li>
						<li><a href="ciao.html">JUL</a></li>
						<li><a href="ciao.html">AUG</a></li>
						<li><a href="ciao.html">SEP</a></li>
						<li><a href="ciao.html">OCT</a></li>
						<li><a href="ciao.html">NOV</a></li>
						<li><a href="ciao.html">DEC</a></li>
					</ul>
				</div>
		<!--Parte dinamica-->
		<div id="content">
			<p>Ciao</p>
		</div>
		</div>

codice Ajax

Codice:
$(document).ready(function() {
						   
	var hash = window.location.hash.substr(1);
	var href = $('#nav li a').each(function(){
		var href = $(this).attr('href');
		if(hash==href.substr(0,href.length-5)){
			var toLoad = hash+'.html #content';
			$('#content').load(toLoad)
		}
	});

	$('#nav  li a').click(function(){
								  
		var toLoad = $(this).attr('href')+' #content';
		$('#content').hide('fast',loadContent);
		$('#load').remove();
		$('#wrapper').append('<div id="load"></div>');
		$('#load').fadeIn('normal');
		window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
		function loadContent() {
			$('#content').load(toLoad,'',showNewContent())
		}
		function showNewContent() {
			$('#content').show('normal',hideLoader());
		}
		function hideLoader() {
			$('#load').fadeOut('normal');
		}
		return false;
		
	});

});
 
Ultima modifica di un moderatore:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, a che ti serve l'hash ? non ho capito molto, ti basta caricare nel div il contenuto della pagina dell'attributo href ?
 

frengo

Nuovo Utente
16 Mar 2016
5
0
0
Ciao, a che ti serve l'hash ? non ho capito molto, ti basta caricare nel div il contenuto della pagina dell'attributo href ?

Lo script l'ho scaricato non consoscendo bene il linguaggio,su firefox funziona su chrome no,se sapete darmi un codice alternativo mi fa piacere(non so se cambia qualcosa,tenete conto che nella pagina è presente anche il bootstrap)
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Si, decisamente cambierei codice ma volevo chiederti se il contenuto del div deve cambiare con quello che c'è nelle pagine ciao.html.
Mi spiego meglio, la pagina è sempre ciao.html o cambia per ogni <li> ?
 
Ultima modifica:

frengo

Nuovo Utente
16 Mar 2016
5
0
0
Si per ogni <li> c'è una pagina HTML diversa.
Praticamente io clicco sul link che sarebbe un mese per ogni mese deve apparire un contenuto diverso in quel div
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
puoi provare semplicemente cosi
Codice:
$(document).ready(function () {
    $("#nav ul li a").click(function (e) {
        e.preventDefault();
        $("#content").load($(this).attr("href"));
    });
});
 

frengo

Nuovo Utente
16 Mar 2016
5
0
0
puoi provare semplicemente cosi
Codice:
$(document).ready(function () {
    $("#nav ul li a").click(function (e) {
        e.preventDefault();
        $("#content").load($(this).attr("href"));
    });
});
il codice funziona solo su firefox,ma carica tutta la pagina non solo la parte che mi interessa,mentre chrome non ne vuole sapere,mi da errore nel file ajax e nella libreria del jQuery(v1.7.1),non va bene la versione di jQuery?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
che errore ?
la versioone va bene anche se è meglio sempre l'ultima, l'importante è che non ne includi 2 che allora potrebbero andare in conflitto
 
Discussioni simili
Autore Titolo Forum Risposte Data
M Unire 2 funzioni per l'invio di un form e con l'apertura di un div Javascript 0
J Far comparire e scomparire un div con un select Javascript 1
E Div che scompare con scroll jquery Javascript 0
G Aiuto HTML, collegamento con un bottone a una <div> di un' altra pagna HTML e CSS 5
Stefano Migotto Creazione di un div con php o js PHP 9
L [Javascript]Scorrere div con frecce avanti-indietro Javascript 0
ANDREA20 [HTML] problema con i div HTML e CSS 10
L [Javascript]Aprire div con click e chiuderlo con altro pulsante Javascript 2
Andrea_Ventura [HTML] Creare un DIV con slideshow HTML e CSS 5
A Javascript Nascondere Div con id numerico dinamico Javascript 18
A Visualizzare div quando le immagini sono state uploadate con successo (Ajax) Ajax 0
trattorino [PHP] prelevare solo div con id PHP 1
S [Javascript] Aggiornare solo un DIV una sola volta con un click di un bottone Javascript 9
A [HTML] div flessibile con span HTML e CSS 14
E [Javascript] problema con margine quando viene mostrato div Javascript 0
D [HTML] Problema con Dreamweaver; 1) tabella con larghezza 100% 2) Immagine che si adatta a Div HTML e CSS 28
A [WordPress] [HTML] Link in div con z-index inferiore WordPress 1
Marcello.Fiore Nascondere div con jQuery jQuery 7
Erzsébeth Drag div con class Javascript 9
G validazione form con div tipo alert jQuery 0
F [HTML] Inserire testo all'interno di una div con border radius HTML e CSS 2
P nascondere div con css inline Javascript 2
M Problema con ciclo foreach per chiusura apertura div in base al numero di record in database PHP 1
A centrare iframe con div HTML e CSS 2
B div riempito con testo collegato a esempio.txt o sincronizzazione tra div HTML e CSS 1
P div fisso con offset() o position() jQuery 2
P Div visibile con ie ma non con firefox e chrome HTML e CSS 7
S aggiornamento div con passaggio parametri da href Ajax 8
P aggiornare div con un clic senza reload Ajax 2
L sostituzione contenuto diversi div con document.getelementbyid Javascript 1
C Div con bordi come sfondo HTML e CSS 6
C Form con dentro div errore validatore w3c HTML e CSS 6
M Div dinamici con PHP jQuery 1
gandalf1959 Background image in un div con CSS non funziona HTML e CSS 4
otto9due Incrementare id div con php PHP 2
Emix Slideshow con div sovrapposto HTML e CSS 5
max_400 Sostituire un div con un altro il comando innerHTML è bloccato Javascript 0
asevenx centrare sito con div HTML e CSS 7
C Dreamweaver cs4 problemi con div Ap HTML e CSS 0
asevenx struttura DIV realizzata con float: left che si spezza HTML e CSS 3
G Stampare valori in più div con PHP e MySQL PHP 4
B Auto-aggiornamento DIV con php+ayax PHP 1
F toggle con testo al toggle tra due div jQuery 3
D Problema con lo scroll della pagina e del div position:fixed HTML e CSS 0
D Problema con sovrapposizione DIV HTML e CSS 2
criric Div con frasi a rotazione Snippet Javascript 1
Monital I div non si accostano con float:left HTML e CSS 1
D Aiuto con Ajax e pagine incluse nei DIV Ajax 1
P Problema con hover div jQuery 2
M CSS...dinamico? Altezza div variabile, ma con immagine come bordo HTML e CSS 4

Discussioni simili