Я искал этот день целый день. Измените валюту на всей странице при выборе между странами или валютами в выпадающем меню.
В основном мне нужно выпадающее меню, которое показывает страны или валюты. Когда вы выбираете кого-либо из них, например, USD, все цены на странице изменяются на доллары США. Теперь, если вы измените его AUD / CAD / PKR и т. Д., Они будут соответственно изменены. Я в основном нуждаюсь в этом в Javascript, но если кто-то может предоставить его на PHP, все будет хорошо.
Очень хороший пример: http://creativeon.com Когда вы меняете валюту в раскрывающемся меню справа вверху – она изменяет валюту всех пакетов в основном контенте.
Я разработчик HTML и мало знаю о javascript. Пожалуйста, помогите мне.
PS Я тоже искал codingforums.com и нашел только две ссылки, которые мне не подходят, потому что они конвертер валют:
Красота webapps заключается в том, что вы можете брать хорошие идеи, глядя на исходный код (используя платный, как плагин Firebug в FF). Как вы можете видеть в примере, вы указываете, что страница перезагружается, когда выбрана другая валюта:
$('#Items, #Items_input').change(function(){ $.post('/conlogic/ajax.php?action=currency', {'curr': $(this).val()}, function(data){ if ( data=="OK" ) window.location.reload(); }); }); По-видимому, в этом случае страница повторно отображается на стороне сервера с другой валютой.
Я пишу версию javascript. нет Ajax, ставки валютных курсов были заимствованы из Google.
Код HTML
<select id="currencySelector"> <option value="usd">USD</option> <option value="aud">AUD</option> <option value="eur">EUR</option> <option value="gbp">GBP</option> </select> <div class="currency" data-currencyName="usd">15<span>USD</span></div> <div class="currency" data-currencyName="eur">15<span>EUR</span></div> <div class="currency" data-currencyName="gbp">15<span>BGP</span></div> <div class="currency" data-currencyName="aud">15<span>AUD</span></div>
Код Javascript
var selector = document.getElementById("currencySelector"); var currencyElements = document.getElementsByClassName("currency"); var usdChangeRate = { AUD: 1.0490, // 1AUD = 1.0490 USD EUR: 1.4407, // 1EUR = 1.4407 USD GBP: 1.6424, USD: 1.0 }; selector.onchange = function () { var toCurrency = selector.value.toUpperCase(); for (var i=0,l=currencyElements.length; i<l; ++i) { var el = currencyElements[i]; var fromCurrency = el.getAttribute("data-currencyName").toUpperCase(); if (fromCurrency in usdChangeRate) { var // currency change to usd fromCurrencyToUsdAmount = parseFloat(el.innerHTML) * usdChangeRate[fromCurrency]; var // change to currency unit selected toCurrenyAmount = fromCurrencyToUsdAmount / usdChangeRate[toCurrency]; el.innerHTML = toCurrenyAmount + "<span>" + toCurrency.toUpperCase() + "</span>"; el.setAttribute("data-currencyName",toCurrency); } } };
Запустить код
Вы можете запустить код выше по адресу http://jsbin.com/ewuyoq/5 или создать свою собственную версию http://jsbin.com/ewuyoq/5/edit
Я бы использовал jQuery, поэтому не стесняйтесь игнорировать мой ответ, если вы не хотите использовать внешнюю библиотеку. Его можно найти на сайте http://www.jquery.com.
Во-первых, вы создаете промежуток для всех мест, где нужно изменить валюту, дать ей класс «валюта» и в атрибуте name, вы поместите значение в свою «базовую валюту». Пример:
<span class="currency" name="499"> 499 </span>
Затем вы можете сделать кнопку, скажем, что она имеет идентификатор «showInEuro».
<input type="button" id="showInEuro" />
Затем напишите код jQuery, похожий на этот:
var usdToEuroExchRate = 1.5; // Obviously just a magic constant // When the button is clicked $("#showInEuro").click(function() { // Iterate through all of the currency spans $("span.currency").each(function(index) { // And take their names times the exchangerate and put it in the span. $(this).text($(this).attr("name") * usdToEuroExchRate); }); });
Конечно, вы должны попытаться использовать реальные обменные курсы.
Я сделал JSFiddle для вас: http://jsfiddle.net/An3v9/9/