引导下拉菜单链接不起作用答案

【问题标题】：bootstrap dropdown menu link not working引导下拉菜单链接不起作用
【发布时间】：2014-03-24 14:51:40
【问题描述】：

我已经找到了答案，发生的事情是我在中添加了类，所以有元素与我的链接重叠，让我无法点击它。谢谢你的帮助！

我想编辑我在下面所说的内容。我已将链接更改为https://www.google.com/，当我单击它时，它什么也不做。我相信我的问题与链接中的 href 有关

我有一个 php 页面。我想从我的 html 页面链接到。该链接位于我从引导程序中获得的下拉菜单中。当我将鼠标悬停在我的链接上时，我的光标变成了手。但是点击它不会进入页面。我无法弄清楚如何为我的一生解决这个问题。

代码如下：

<li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Classes<b class="caret"></b></a>
          <ul class="dropdown-menu">
             <li class="dropdown">
          <a href="https://127.0.0.7/IA/Student side/PHP/\PHP\IB comp sci\main_login.php" class="dropdown-toggle" data-toggle="dropdown">IB Comp Sci</a>        
          <a href="IA/Student side/PHP/web design/main_login.php" class="dropdown-toggle" data-toggle="dropdown">Web Design</a>
          <a href="https://127.0.0.7/IA/Student%20side/PHP/web%20design/Computer%20repair%20 one\main_login.php" class="dropdown-toggle" data-toggle="dropdown">Comp Repair 1</a>
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Comp Repair 2</a>
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Comp Warrior Tech</a>
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Digital Tools</a>
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Personal Finance</a>
        </li>
        </ul>
    </li>

我认为这要么与链接位于列表内的事实有关，要么与它们重定向到 php 页面有关。当我单击该链接时，该链接将不起作用，但是如果我检查该元素并单击该链接，它会将我带到正确的页面。

【问题讨论】：

那是因为手是a的默认值
\ 和 / 在 URL 中的含义不同。
您是否尝试过用 %20 替换空格并使用 / 代替 \。在https://127.0.0.7/IA/Student%20side/PHP/web%20design/Computer%20repair%20 one/main_login.php 中，%20 和 one\main_page.php 之间有一个空格

标签： php html

【解决方案1】：

按照您的风格使用此代码

style="cursor:default"

例如

 <a href="" style="cursor:default">Test</a>

【讨论】：

除了改变光标的外观之外还能做什么？我希望它显示为手，但是当我单击它时链接将不起作用，但是如果我检查元素并单击它会将我带到正确的页面。

【解决方案2】：

问题存在于您制作链接的风格中，正如@Gumbo 所说，您在链接中混合了 \ 和 /。请记住，文件夹的分隔必须通过 http/https 链接中的 / 来完成。而 \ 仅用于转义。也只使用了一种制作链接的方式，不要只是从任何 url 中提取链接并放置在您的锚标记上。我建议不要使用任何 \ 因为浏览器会自动处理这个。

 <a href="https://127.0.0.7/IA/Student side/PHP/PHP IB comp sci/main_login.php" class="dropdown-toggle" data-toggle="dropdown">IB Comp Sci</a>        
 <a href="https://127.0.0.7/IA/Student side/PHP/web design/main_login.php" class="dropdown-toggle" data-toggle="dropdown">Web Design</a>
 <a href="https://127.0.0.7/IA/Student side/PHP/web design/Computer repair one/main_login.php" class="dropdown-toggle" data-toggle="dropdown">Comp Repair 1</a>

【讨论】：

好的，但我避免空格（对于这个项目）的问题是这些网址已经遍布我的网页，我没有足够的时间来完成它们。这些链接是阻止该项目完成的唯一因素
我可以只输入 %20 而不是空格，对吗？
嗯 %20 和带间隔的 url 都可以在 url 中使用，我只是说它有利于统一性，也可以减少混乱。主要问题是没有相应地使用 \ 和 / ，正如您清楚地看到的那样，我删除了 url 中的所有 \ ，同时使用 / 转换文件夹边界。它之所以有效，是因为 http url 允许 / 作为文件夹边界而不是 \.

【解决方案3】：

根据您尝试使用的具体链接，请考虑以下因素。

仅包含“#”的链接将链接到当前页面的该部分，例如锚点或具有 ID 的元素。在大多数情况下，这不会离开页面或重新加载页面。

至于您的网站文件链接，您已经为带有正斜杠和反斜杠的 URL 添加了格式。删除反斜杠 (\)，因为它们不会更改正斜杠 (/) 等目录

<a href="https://127.0.0.7/IA/Student side/PHP/PHP/IB comp sci/main_login.php" class="dropdown-toggle" data-toggle="dropdown">IB Comp Sci</a>       
<a href="https://127.0.0.7/IA/Student side/PHP/web design/main_login.php" class="dropdown-toggle" data-toggle="dropdown">Web Design</a>
<a href="https://127.0.0.7/IA/Student%20side/PHP/web%20design/Computer%20repair%20 one/main_login.php" class="dropdown-toggle" data-toggle="dropdown">Comp Repair 1</a>

对于 URL 中的空格，尽量避免使用它们以及“-”和“_”以外的任何其他符号，但如果可能，也应尽量避免使用这些符号。还要尝试将所有内容保持为小写，因为 URL 区分大小写。

【讨论】：