3
votes

La liste déroulante ne fonctionne pas après l'importation d'un autre fichier html à l'aide de jquery?

J'essaye d'importer header.html pour éviter la duplication de fichiers. Mais dans cette situation, je ne peux pas utiliser PHP. Ceci est la section principale du fichier index.html ,

<body>
  <!-- include Header -->
  <div id="header"></div>
  <!-- end include header -->
</body>

La section corps que j'ai appelée mon header.html comme suit,

<script
        src="https://code.jquery.com/jquery-3.3.1.js"
        integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
        crossorigin="anonymous">
</script>
<script>
    $(function(){
        $("#header").load("header.html");
        $("#footer").load("footer.html");
    });
</script>

L'en-tête comprend bien mais une fois l'en-tête inclus, les listes déroulantes deviennent non cliquables.

Lorsque je vais inspecter des éléments, il y a des erreurs suivantes,

javascript jquery html css

0 commentaires

4 Réponses :

-1
votes

$(document).ready(function() {

    $.get("header.html", function(response){

        $('#header').html(response);

    });

})

3 commentaires

ce n'est pas php.its jquery

ce script envoie une requête à header.html et récupère toutes les données de cette page et écrit les données renvoyées dans #header

J'essaierai avec ça. Merci @ R.tbr

-1
votes

  <?php include_once('header.html');?>

    <div id="header"></div>

    <?php include_once('footer.html');?>

3 commentaires

J'ai mentionné que je n'ai pas besoin d'une suggestion avec PHP

@DebanjanB s'il vous plaît relisez la question, j'ai mentionné que je ne peux pas travailler avec PHP dans cette situation.

@ Mr.Semicolon Indépendamment du facteur PHP, cette réponse a atterri dans la file d'attente VLQ. Nous avons donc demandé au répondant d'ajouter les verbatim requis.

9
votes

Une des raisons possibles de votre problème serait que si vous avez déjà des balises dans tous les header.html, footer.html et votre page maître. Lorsque vous importez ces sous-pages dans votre page maître, toutes ces balises accompagnent le contenu. Si c'est vrai, supprimez ces balises de vos sous-pages, car votre page maître ne doit avoir qu'une seule des balises spécifiques

0 commentaires

2
votes

1) Supprimez les balises suivantes de header.html et footer.html

$('.selector').slick();

2) En ce qui concerne l'erreur Slick, assurez-vous de ne pas appeler l'init deux fois, la meilleure façon serait p>

<html>
    <head>
    </head>
    <body>
    </body>
</html>

0 commentaires