Question

你有这个问题：

当您单击Bootstrap（当前版本3.3.6）下拉菜单时，它将展开但同时跳转到其href中指定的位置。我仅在Windows 7中的chrome（当前版本51）上遇到此问题。

即使是官方的例子也有问题。

请参阅： http://getbootstrap.com/components/#nav-dropdowns

如果我点击dropdown，它会跳转到页面顶部的“＃”锚。

我有办法解决它，但看起来并不漂亮。

<script>
$(".bs-example .dropdown a.dropdown-toggle").removeAttr("href").css("cursor","pointer");
</script>

希望任何人都能解释为什么它会像这样，以及如何优雅地解决它。

Answer 1

好的，让我自己解释一下。这不是chrome的bug，也不是bootstrap的bug。这是我的一个名为"拖拽搜索"(dragging search)的扩展程序的错误自从我同步了Chrome扩展程序后，我在所有笔记本电脑和台式机上都遇到了这个问题，这让我认为这是一个常见的问题。

该扩展程序主要用于帮助用户通过将其拖动到右侧（在baidu.com中搜索）或向左（在google.com中搜索）来搜索网页中的文本。因此它为拖动操作添加了一个事件监听器。

但是，它还有另一个设计意图解除对原始页面的限制，例如选择/复制/右键单击操作。为实现此目的，它会为各种鼠标操作添加事件侦听器，并通过制作event.returnValue = true来使默认响应可用;

代码片段：

    document.ondragstart = function () {
        event.returnValue = true;
        return (true);
    };
    document.oncontextmenu = function () {
        event.returnValue = true;
        return (true)
    };
    document.onselectstart = function () {
        event.returnValue = true;
        return (true)
    };
    document.onclick = function () {
        event.returnValue = true;
        return (true)
    };
    document.onmousedown = function () {
        event.returnValue = true;
        return (true)
    };
    document.onmouseup = function () {
        event.returnValue = true;
        return (true)
    };
    document.onbeforecopy = function () {
        return (true)
    };
    document.onbeforecut = function () {
        return (true)
    };
    document.oncopy = function () {
        event.returnValue = true;
        return (true)
    };

很清楚为什么我的下拉（以及标签）在点击时会跳开。引导下拉列表和标签使用<a>标记href。默认行为是跳转到href，这是Bootstrap阻止的。扩展名添加了默认行为。

我决定保留扩展名，但只保留选择和拖动事件。结果很好。

顺便说一句，任何人都可以告诉Bootstrap如何阻止下拉列表和标签中<a>的默认行为？

Chrome bug或bootstrap bug：Bootstrap下拉列表在Chrome中单击时会跳转到'href'

1 个答案: