在div之间进行jQuery自定义切换

Question

在这方面有一些问题，我不能理解为什么它不能正常工作。

http://host.philmadelphia2.com/~clare/order/

当你点击两个“订单...”顶部的链接，它们应该在div之间切换。当一个页面处于活动状态时，点击该页面的按钮应该不会有任何效果。应该只有在单击非活动页面的按钮时才会有一个操作。

这是到JS的链接。

http://host.philmadelphia2.com/~clare/wp-content/themes/theme/js/pager.js

我使用jQuery和jQuery UI来实现效果。

谢谢，皮特

Answer 1

我在jsfiddle上拼凑了一个看起来不错的快速模型。为了让它更容易阅读，我去掉了很多标记。

我所做的唯一更改是删除了函数声明中的$符号，并使用live()事件处理程序代替了click()。

Edit:为了便于解释，因为您是通过添加和删除类来操作DOM的，所以必须使用live()事件处理程序。

Answer 2

您的锚点选择器错误。在您的标记中，unactive类仅应用于页面加载时的一个锚点，因此a.unactive将只选择具有unactive类的锚点。您希望将click事件附加到两个锚点，因此应该使用应用于这两个锚点的button类。尝尝这个

    jQuery('a.unactive').live(function($){
        jQuery('a.button').toggleClass('unactive');
        jQuery('div.page').toggle('blind','',500);
        console.log('clicked');
    });

Answer 3

如果你一直点击“排序样本”，就会在所有a.buttons上来回切换不活动的类。

您基本上要寻找的是一个jQuery选项卡脚本。在你的例子中，“标签”只是文本链接。我最近在一个带有文本选项卡的网站上使用了 script，它工作得很好。