[jquery] caricare contenuti in un div

**dash** · 01-09-2009, 17:45

Salve a tutti,
ho costruito un menu dal quale vorrei che ad ogni link venisse caricata la relativa pagina in un div della pagina principale. Ho sentito dire che con jquery è possibile realizzare ciò ma non riesco proprio a farlo funzionare. Ho fatto una banale pagina per provare se funzionasse ma niente.

codice:

<html>
<head>
	<title></title>
<script type="text/javascript" src="jquery.js"></script> 
<script type=”text/javascript”>
$(document).ready(function(){
$(”#dx”).load(”h.php”);
});
</script>

</head>

<body>
<div id="dx"></div>

</body>
</html>

Sapreste dirmi qual'è il problema e la possibile soluzione? Inoltre se avete consigli su come far in modo che ad ogni link del menu si carichi la pagina in un div saranno sicuramente molto utili. Grazie!

**dash** · 01-09-2009, 20:21

Ho risolto il problema di prima...era una cavolata...solo che adesso sto cercando di fare in modo che al click dei link sul menu appaia la relativa pagina sul div, usando questo codice:

codice:

<script type="text/javascript" src="jquery.js"></script>
<script src="jquery.js" type="text/javascript">
function loadContent(id) {
$("#dx").load("page"+id+".html");
}

</script>

codice:

Agosto 2009

<a href=="javascript:loadContent(2)" class="sublink">Luglio 2009</a>

<a href=="javascript:loadContent(3)" class="sublink">Giugno 2009</a>

solo che adesso non funziona più...suggerimenti?

**marco.carrieri** · 01-09-2009, 20:34

sicuro che vada il # prima del nome del div?

**dash** · 01-09-2009, 20:37

Sisi, almeno di questo sono sicuro. L'errore che mi dà il browser è Previsto Oggetto ma non dice niente di più

**marco.carrieri** · 01-09-2009, 21:14

prova con questo codice, ovviamente modifica i path.

Codice PHP:


<html>

    <head>

        <title>prova</title>

        <script type="text/javascript" src="jquery-1.3.1.min.js"></script>

        <style>

            #links

            {

                background:lightgreen;

                width:300px;

            }

            #links a

            {

                margin-right:20px;

                font-weight:bold;

                font-size:30px;        

                color:#000;

            }

            #links a:hover

            {

                color:red;

            }

            #content

            {

                height:300px;

                background:pink;

                margin-top:20px;

            }

        </style>

        <script type="text/javascript">

            function loadContent(elementSelector, sourceUrl)

            {

                $(""+elementSelector+"").load(sourceUrl);

            }

        </script>

    </head>

    <body>

    <div id="links">

        [url="javascript:loadContent('#content','prova1.html');"]Link 1[/url]

        [url="javascript:loadContent('#content','prova2.html');"]Link 2[/url]

    </div>

    <div id="content"></div>

    </body>

</html>

**dash** · 01-09-2009, 21:24

Ti ringrazio lo script funziona alla perfezione!!
Un piccolo particolare se qualcuno fosse interessato ad usare questo script il codice del link esatto è senza il trattino su javascript.

Grazie ancora!

**marco.carrieri** · 01-09-2009, 21:27

Purtroppo il forum per motivi di sicurezza lo corregge in automatico.

**Kagaho** · 18-01-2011, 15:16

ciao a tutti.
Scusate se riesumo questo post, ma avevo una domanda da porvi inerenti questo argomento.

Ho scritto un codice analogo a quello riportato sopra:

codice:

<script language="javascript" type="text/javascript">
		var $j=jQuery.noConflict();
		function loadContent(id){
                         switch (id) {
                               case 1:
					$j("#content").load("php/sections.php #section_home");
                                        break;
                         }
                }
</script>  

<body> 
     <ul id="nav">
	[*] Home [/list]
 </body>

il mio problema è che ie7 non esegue la funzione "load" e non visualizza il contenuto del div nel file esterno. C'è qualcuno che sa come risolvere?
Grazie.

**carlogh** · 18-01-2011, 16:50

se posso darti un consiglio, io cambierei i link del menù in questo modo:

codice:

Link 1

in

codice:

Link 1

in questo modo anche chi non ha javascript abilitato (compresi i motori di ricerca) può vedere qualcosa del tuo sito.

**Kagaho** · 18-01-2011, 19:20

grazie mille!!

Discussione: [jquery] caricare contenuti in un div

Strumenti discussione

Ricerca discussione

Visualizza

[jquery] caricare contenuti in un div

Permessi di invio