-2

我有一个值表。JQuery 是否可以通过单击货币链接来更改具有汇率的单元格中的值?这个静态示例表

<table border="1">
    <tr>
      <td class="currency">100</td>
      <td class="currency">200</td>
      <td class="current">now in USD</td>
    </tr>
    <tr>
      <td class="currency">150</td>
      <td class="currency">230</td>
    </tr>
    <tr>
      <td class="currency">400</td>
      <td class="currency">200</td>
    </tr>
    <tr>
      <td class="currency">550</td>
      <td class="currency">2920</td>
    </tr>
  </table>

  <a href="#" class="USD">USD</a>
  <a href="#" class="EUR">EUR</a>

请看jsfiddle。换句话说,通过点击货币价值必须根据汇率重新计算它们。在我关于 jsfiddle 的示例中,我想了解如何简单地更改值(例如usd=1 eur=1.3)谢谢!

4

3 回答 3

4

首先,您需要存储原始美元值,以便您可以将它们用作所有汇率的基础。一个data-x属性是完美的。

$('.currency').each(function() {
    $(this).data('usd-value', $(this).text());
});

然后,您可以简单地将这个值乘以您需要的任何汇率,再次存储在data链接本身的属性中。试试这个:

<a href="#" class="exchange USD" data-exchangerate="1">USD</a>
<a href="#" class="exchange EUR" data-exchangerate="1.3">EUR</a>
<a href="#" class="exchange GBP" data-exchangerate="0.63">GBP</a>
$(".exchange").click(function() {
    var rate = $(this).data('exchangerate');
    $('.currency').each(function() {
        $(this).text(parseFloat($(this).data('usd-value') * rate));
    });
});

示例小提琴

请注意,我还添加GBP只是为了显示此方法的可扩展性。

于 2012-11-15T08:31:49.320 回答
1

你也可以这样做:-

var flag = false;
$('.USD').click(function() {
    if (flag)
    {
        $('.currency').each(function() {
            $(this).text(parseFloat($(this).text() / 1.3));
        });
        flag = false;
        $('.current').text("Now in USD");
        $('.EUR').removeAttr("disabled");
    }
});
$('.EUR').click(function() {
    flag = true;
    $('.currency').each(function() {
        $(this).text(parseFloat($(this).text() * 1.3));
    });
    $('.current').text("Now in EUR");
    $(this).attr("disabled", "disabled");
});

参考现场演示

于 2012-11-15T08:40:06.923 回答
0

您可以按类选择它们并修改它们:

$('.currency').each(function(){
    var eurMultiplier = 1.3;
    var currentValue = parseInt($(this).html());
    var newValue = currentValue * eurMultiplier;
    $(this).html(newValue);
});

这段代码未经测试,但应该给你一个关于如何做的提示。

于 2012-11-15T08:31:23.090 回答