1

我有一个简单的代码，三种形式的一种不工作，另两种形式工作但我想了解是什么导致两种方法工作。

请看一下简单的代码。 http://jsfiddle.net/NjWAz/（不能正常滑动）。

而如果只附加了 div id，那么它会正确滑动。 http://jsfiddle.net/NjWAz/2/ （这是我的第一个问题，是什么导致它实际工作？如何改变 ids 使它工作？）

并以另一种形式。 http://jsfiddle.net/NjWAz/1/ （它也可以工作，所以这是我的第二个问题，即通过阻止默认行为如何使其工作......以及什么是破坏其在http://工作的默认行为jsfiddle.net/NjWAz/）

4

1 回答 1

1

它不适用于第一个示例的原因是因为您没有阻止链接的默认行为。当您创建带有井号标签的链接（例如#two）时，该链接会将页面移动到具有相同ID参数的元素（例如<div id="two">）

因为在第一个示例中，您有一个指向的链接，#two并且您有一个具有相同 id<div id="two">的元素，它会跳转到该元素，然后继续执行您的 jQuery 动画，使其看起来好像正在移动到#three.

第二个例子，href属性值不匹配任何 HTML 元素，所以它工作正常。

在第三个示例中，您阻止了链接的默认行为，因此它可以工作。

您可以使用第三个示例中的方法来阻止默认行为，或者您可以将 return false; 在您的点击事件结束时：

$( function () {
    $(".clickIt a").click( function () {
        var linked = $(this).attr("href");
        var pos = $(linked).position();

        $(".clickSlider").stop().animate({left: -pos.left,}, 500 );

        return false;
    });
});​​​​​

希望我的解释是有道理的:)

于 2012-02-24T17:13:46.250 回答