Question

我不能告诉你我多么感激一些帮助。

我正在尝试使用三个按钮，以便访问者可以按下按钮并以首选货币显示定价。

我理解如何使用下面的一列进行此操作但正如您将看到的那样，当我将其应用于多个列时，只有第一个列可用（当单击按钮时切换价格）。

我知道html中的id不能重复，这可能是问题的根源。 但是，我不知道如何使定位工作用于ID以外的其他工作。

我已将所有代码粘贴到这个小提琴中：http://jsfiddle.net/Rd7mV/ - 请注意，应该更改的价格会在小提琴上以红色突出显示。

javascript在这里：

jQuery("#menu a").click(function () {
    var link = jQuery(this).attr('href');
    var showIt = jQuery(link);
    var hideIt = jQuery(".cc.current");

    hideIt.fadeOut(100, function () {
        hideIt.removeClass("current");
        showIt.addClass("current");
        showIt.fadeIn(100);
    });
});

如果有人可以提供帮助，请取悦，这将是一个救星。我已经搜索了高低，并且真的需要一些实施方面的帮助。

谢谢。 AB。

Answer 1

例如，尝试使用类。

，而不是尝试显示#currencypounds的所有ID

您已为每个部分隐藏了DIV，其ID为#currencypounds，＃cererseos，#currencydollars。将这些更改为类而不是ID，然后使用您的链接显示特定的类并隐藏其余类。我没有时间为你改变这一切，但你应该能够弄明白。

Answer 2

使用类而不是id，例如，

您为具有class dollar的多个元素提供了一个类。您现在可以通过

选择这些元素

$(".dollar")。现在，例如，您需要使用class dollar，use，

从所有元素中移除ClassClass

$(".dollar").removeClass('current');

Answer 3

这是一个有效的版本：jsFiddle。

做了以下事情：

而不是使用href来存储使用自定义属性data-targetCurrency的货币（这样可以更好地防止href的行为）：
```
<a href="javascript: void(0);" data-targetCurrency="currencyeuros"><button class="btn btn-danger">
```

使用其他自定义属性id：

，而不是使用data-currency

<div class="cc" data-currency="currencyeuros">&euro;159</div>

将javascript更改为：

jQuery("#menu a").click(function () {
    var currency = jQuery(this).attr('data-targetCurrency');
    var showIt = jQuery("[data-currency=" + currency + "]");
    var hideIt = jQuery(".cc.current");

    hideIt.fadeOut(100, function () {
        hideIt.removeClass("current");
        showIt.addClass("current");
        showIt.fadeIn(100);
    });
});

NB：

属性的jQuery选择器是jQuery("[attributename = attributevalue]")

Answer 4

我会研究数据属性。显然你的jQuery只是针对第一个项目，而不是全部。看一下针对多个div的小提琴。

jQuery Show and Hide multiple divs with a selected class

http://jsfiddle.net/fKHsB/

jQuery(function() {
jQuery('.buttons a').click(function() {
    $(this).addClass('selected').siblings().removeClass('selected');
    var target = $(this).data('target');
    if (target === 'all') {
        jQuery('.targetDiv').show();
    } else {
        jQuery('.targetDiv').hide();
        jQuery('#div' + target).show();
    }
});

}）;

Answer 5

是的，您的问题是您有多个具有相同ID的元素。你需要引用类而不是id。

我已经修改了你的小提琴以使其发挥作用。我将id改为了类。

http://jsfiddle.net/kMYye/1/

<div class="cc current currencypounds">&pound;1369</div>

使用jQuery定位多个div

5 个答案:

NB：