Question

我正在建立一个电子商务网站，并添加了一些用于添加下拉货币选择器的代码。但是，虽然货币实际发生了变化，但菜单的顶部也应更新以显示当前所选货币的名称，仅显示“英国”字样。默认值。

这是HTML：

<div class="currency">
<form method="post" action="/" name="lancur">
    <table class="tables">
        <tbody>
            <tr>
                <td>
                    <p class="both"><b>Currency:</b></p>
                </td>
                <td><img src="/admin/images/flags/gb.gif" align="right" hspace="0" vspace="0" alt="Sterling (GBP)"></td>
            </tr>
            <tr>
                <td colspan="2" width="100%" style="padding-top: 3px">
                    <select name="currency" style="width: 100%" onchange="lancur.submit();">
                        <option value="2">Euro (EUR)</option>
                        <option selected="" value="1">Sterling (GBP)</option>
                        <option value="3">US Dollar (USD)</option>
                    </select>
                </td>
            </tr>
        </tbody>
    </table>
    <input type="text" class="conform" name="conform" value="">
</form>
<div class="current-currency"><span><i class="fa fa-gbp"></i> United Kingdom</span> <i class="fa fa-angle-down"></i></div>
<ul style="overflow: hidden; display: block;">
    <li><a href="?currency=1" rel="nofollow"><i class="fa fa-gbp"></i> United Kingdom</a></li>
    <li><a href="?currency=2" rel="nofollow"><i class="fa fa-eur"></i> Europe</a></li>
    <li><a href="?currency=3" rel="nofollow"><i class="fa fa-usd"></i> United states</a></li>
</ul>

这是Javascript：

<script>
var current = $( ".currency select option:selected" ).val();
if (current==1){
  $( ".current-currency span" ).html('<i class="fa fa-gbp"></i> United Kingdom');
}
if (current==2){
  $( ".current-currency span" ).html('<i class="fa fa-eur"></i> Europe');
}
if (current==3){
  $( ".current-currency span" ).html('<i class="fa fa-usd"></i> United States');
}
$( ".current-currency" ).click(function() {
  $( ".currency ul" ).slideToggle("fast");
});
</script>

非常感谢任何帮助 - 非常感谢提前，

麦克

Answer 1

正如劳伦斯所说，改变以下HTML：

 <select name="currency" style="width: 100%" onchange="lancur.submit();">

到

 <select name="currency" style="width: 100%" onchange="updateName()">

然后添加以下javascript代码：

    function updateName() {
    var current = $(".currency select option:selected").val();
    if (current == 1) {
        $(".current-currency span").html('<i class="fa fa-gbp"></i> United Kingdom');
    }
    if (current == 2) {
        $(".current-currency span").html('<i class="fa fa-eur"></i> Europe');
    }
    if (current == 3) {
        $(".current-currency span").html('<i class="fa fa-usd"></i> United States');
    }
    $(".current-currency").click(function() {
        $(".currency ul").slideToggle("fast");
    });
    }

下拉货币选择器

1 个答案: