gpt4 book ai didi

javascript - 当使用 PHP include 时切换按钮不起作用

转载 作者:太空宇宙 更新时间:2023-11-04 05:49:47 25 4
gpt4 key购买 nike

我想建立一个基本的网站。下面我有 nav.html 文档,我在其中设计了一个基本的下拉菜单。当我用浏览器打开 nav.html 时,切换按钮工作正常,当我点击它时,下拉菜单折叠并当我再次点击它时,下拉菜单消失了。当我在 home.php 文件中包含 nav.html 时出现问题。当我单击切换按钮时,下拉菜单会折叠,但当我再次单击它时,下拉菜单会保持打开状态并且不会消失。

<html>

<head>

<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>

<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

<meta charset="utf-8">

</style>

</head>

<body>

<nav class="navbar navbar-light bg-lignt">

<button class="navbar-toggler ml-auto" type="button" data-toggle="collapse" data-target="#collapsingNavbar2">
<span class="navbar-toggler-icon my-toggler"></span>

</button>
<div class="navbar-collapse collapse" id="collapsingNavbar2">


<ul class="navbar-nav mx-auto">

<li class="nav-item active">

<a class="nav-link" href="#">Link</a>

</li>

<li class="nav-item">

<a class="nav-link" href="#">Link</a>

</li>

</ul>

</div>

</nav>

</body>

</html>

home.php

<html>

<title>Home</title>

<head>

<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

<meta charset="utf-8">

<style>

</style>

</head>


<body>

<?php include('./nav.html'); ?>

</body>

</html>

最佳答案

您在 HTML 中包含 HTML,这是不受支持的。当您将 nav.html 包含到 home.php 中时,您想要删除标签 body、html 和 head。

<nav class="navbar navbar-light bg-lignt">

<button class="navbar-toggler ml-auto" type="button" data-toggle="collapse" data-target="#collapsingNavbar2">
<span class="navbar-toggler-icon my-toggler"></span>

</button>
<div class="navbar-collapse collapse" id="collapsingNavbar2">


<ul class="navbar-nav mx-auto">

<li class="nav-item active">

<a class="nav-link" href="#">Link</a>

</li>

<li class="nav-item">

<a class="nav-link" href="#">Link</a>

</li>

</ul>

</div>

</nav>

PHP 和 HTML 是完全不同的语言。使用 PHP,您可以生成 HTML 内容。您不包括 nav.html 的“结果”,而是包括代码。

关于javascript - 当使用 PHP include 时切换按钮不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58375540/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com