Изменить значения в <td> с jquery

Question

У меня есть таблица значений. Возможно ли с помощью 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> 

Pls выглядеть jsfiddle. Другими словами, нажав на валютные значения, необходимо пересчитать их согласно ставкам. В моем примере на jsfiddle я хочу понять, как просто изменить значение (например, usd=1eur=1.3) Спасибо!

Answer 1

Прежде всего, вам необходимо сохранить оригинальные значения USD, чтобы вы могли использовать их в качестве базы для всех курсов обмена. Атрибут 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)); 
    }); 
}); 

Example fiddle

Примечание Я также добавил GBP, чтобы показать, как расширяемый этот метод.

Answer 2

Вы можете выбрать их по классам и модифицировать их:

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

этот код не тестировался, но Шоуда дать вам подсказку о том, как это сделать.

Answer 3

Вы можете сделать это слишком: -

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"); 
}); 

См LIVE DEMO