以下是一些更新：

Question

我有一个非常基本的jQuery选项卡设置。一切正常，但我需要在URL中使用哈希来指示活动选项卡，所以我添加了一个条件来检查哈希。现在，当页面加载时，它实际上是激活锚点并将页面向下移动。为什么不是“回归虚假”;工作

$(document).ready( function() {
  $(".tabs a").click(function() {
    $(".tabs a").removeClass("active");
    $(".tabs a").addClass("button secondary");
    $(this).attr("class","button active");
    var href = $(this).attr("href");
    $(href).parent().find("> .active").removeClass("active");
    $(href).addClass("active");
    return false;
  });
  if(window.location.hash) {
    $(".tabs a[href$='"+window.location.hash+"']").click();
  } else {
    $(".tabs a:eq(0)").click(); //default to first tab
  }
});

**

以下是一些更新：

**

如果我只是输入实际的哈希值而不是从window.location.hash中提取它，它就可以完美地运行。

$(".tabs a[href$='#Contact2']").click();

单击不同的选项卡不会在页面加载时移动页面，并根据哈希值自动单击选项卡。

如果我放置条件然后在jquery选择器中不使用aa变量自动单击，它工作正常，假设位置哈希与我点击的哈希不匹配（奇怪，我知道......）

if(window.location.hash === "#Contact2") {
  $(".tabs a[href$='#Contact4']").triggerHandler("click");
} else {
  $(".tabs a:eq(0)").click(); //default to first tab
}

这对我来说真的没什么意义。似乎唯一的问题是在jquery选择器中使用window.location.hash ......

Answer 1

也许这段代码应该让你的工作：

 $(".tabs a").click(function(){
            // your code 
            return false;
 });

另一种方式是：

$(".tabs a").click(function(e) {
    e.preventDefault();
    // your code
});

Answer 2

请尝试使用preventDefault()。不要忘记e内的.click(function(e)。

$(document).ready( function() {
  $(".tabs a").each(function() {
    $(this).click(function(e) {
      e.preventDefault();
      $(".tabs a").removeClass("button secondary active");
      $(".tabs a").addClass("button secondary");
      $(this).attr("class","button active");
      var href = $(this).attr("href");
      $(href).parent().find("> .active").removeClass("active");
      $(href).addClass("active");
    });
  });
  if(window.location.hash) {
    $(".tabs a[href$='"+window.location.hash+"']").click();
  } else {
    $(".tabs a:eq(0)").click(); //default to first tab
  }
});

然后将一些东西链接在一起......

$(document).ready( function() {
  $(".tabs a").each(function() {
     $(this).click(function(e) {
      e.preventDefault();
      $(".tabs a").removeClass("button secondary active").addClass("button secondary");
      $(this).attr("class","button active");
      var href = $(this).attr("href");
      $(href).parent().find("> .active").removeClass("active")
      $(href).addClass("active");
    });
  });
  if(window.location.hash) {
    $(".tabs a[href$='"+window.location.hash+"']").click();
  } else {
    $(".tabs a:eq(0)").click(); //default to first tab
  }
});

我不确定你在这里做什么......

      $(".tabs a").removeClass("button secondary active")
      $(".tabs a").addClass("button secondary");

第二行会立即添加您使用第一行删除的两个类。

Answer 3

您的方法非常递归。尽量避免在集合中运行集合。

以下是jQuery 1.7+实现中的一些片段，可能会满足您的需求。

...初始化

$(body).on("click", ".tabs a", { }, _selectTab);

......一些功能

_selectTab : function(event) {
    $(".tabs a").removeClass(selected); // clear all matches.
    $(event.currentTarget).addClass(selected); // something like that.
}

Answer 4

而不是.click()使用.triggerHandler("click")

此外，您的点击处理程序需要e个参数，您需要拨打e.preventDefault()而不是旧学校return false。

最后，而不是if(window.location.hash)使用if(window.location.hash.length > 0)

即使click函数返回false，jQuery click（）仍会激活锚点

以下是一些更新：

4 个答案: