jQuery.load pour charger le fichier HTML

J'ai jamais utilisé jQuery avant cela, mais je vais vous expliquer ce que je suis en train de faire.jQuery.load pour charger le fichier HTML

index.html

<!DOCTYPE html> 
<html> 
    <head> 
     <title>My Awesome Website</title> 
     <link href="style.css" rel="stylesheet" type="text/css"/> 
     <link rel="shortcut icon" href="/favicon.ico" /> 
     <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    </head> 
    <body> 

<!-- <iframe width="100%" height="175" frameborder="0" scrolling="no" src="navbar.html"></iframe> I used to use this - but i cant have dropdown menus. --> 
      <!-- This is my problem --> 
     <script> 
       $('#navbar').load('./navbar.html'); 
     </script> 
     <noscript> 
      <h1>Please enable Javascript!</h1> 
     </noscript> 

     <div id="container"> 
       <!-- Content Here --> 
     </div> 

    </body> 
</html>

navbar.html

<div id="navbar"> 
     <li><object width="64" height="64" data="favicon.svg" type="image/svg+xml"></object></li> 
     <li><object width="64" height="64" data="icons/tech.svg" type="image/svg+xml"></object></li> 
     <li><object width="64" height="64" data="icons/games.svg" type="image/svg+xml"></object></li> 
     <li><object width="64" height="64" data="icons/contact.svg" type="image/svg+xml"></object></li> 
</div>

Donc ce que je suis en train de faire ici, est d'avoir beaucoup de pages HTML qui tout lien à un La page html de navbar, donc quand je change le navbar.html, je ne dois pas changer chaque page. J'ai déjà une autre question here. Davor Milnaric suggéré « si vous utilisez jquery, vous pouvez essayer avec '.load() fonction. Api.jquery.com/load », mais je ne peux pas le faire fonctionner. Qu'est-ce que je fais mal? Comment je le répare? Toute aide serait très appréciée.

Source

2013-05-26 Yharooer

Vous devez faire 2 choses:

Utiliser $ (document) .ready() - lire here; Tout le code jQuery doit être enveloppé comme ceci:
```
$(document).ready(function(){ 

    //jquery code goes here....   

}); 
```
changement

$('#navbar').load('./navbar.html');

$('#container').load('./navbar.html');

.. vous ne disposez pas d'un élément avec id = "navbar" et selon this:

Si aucun élément est mis en correspondance par le sélecteur - dans ce cas, si le document ne contient pas d'élément avec id = « résultat » (dans notre cas « navbar ») - la demande Ajax ne sera pas envoyé.

Source

2013-05-26 02:00:19

Il est également possible que vous devez attendre le DOM pour charger.

<script> 
     $(document).ready(function() { 
      $('#result').load('navbar.html #navbar', function() { 
       alert("loaded"); 
      }); 
     }); 
    </script> 

    <div id="result"> 
    </div>

Source

2013-05-26 01:40:57 eklhad

Salut, Merci pour votre réponse. :) Quand j'essaie ça, rien ne change, la barre de navigation ne charge toujours pas ... Des idées? – Yharooer

jQuery.load pour charger le fichier HTML

Répondre

Questions connexes