Question

目前我的网站内置了翻译脚本。

我的问题是激活它，并将图像和文本更改为所选语言。

这是我目前的代码：

<div class="btn-group">
    <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
    <img src="images/flag/United-Kingdom.png" alt=""> English <span class="fa fa-bars"></span>
     </button>
     <ul class="dropdown-menu" role="menu">
         <li><a href="#"><img src="images/flag/Germany.png" alt=""> Deutsch</a></li>
         <li><a href="#"><img src="images/flag/France.png" alt=""> Français</a></li>
         <li><a href="#"><img src="images/flag/Spain.png" alt=""> Español</a></li>
         <li><a href="#"><img src="images/flag/Nederlands.png" alt=""> Nederlands</a></li>
     </ul>
</div>

如何将当前语言选择图像更改为他们选择的图像？

如果您需要更多信息，我会很乐意给它。

Answer 1

获取所点击项目的图像来源和文本，并用它替换按钮内容

$('.dropdown-menu a').click(function(){
    $('.dropdown-toggle').html( $(this).html() + '<span class="fa fa-bars"></span>');    
});

jsFiddle Demo

或没有jQuery

HTML

<a href="#" onclick="changeDefault(this)"><img src="images/flag/Germany.png" alt="" > Deutsch</a>

JS

function changeDefault(item) {    
    var button = document.getElementsByClassName('dropdown-toggle')[0]
    button.innerHTML = item.innerHTML + '<span class="fa fa-bars"></span>';
}

jsFiddle Demo

动态更改图像和文本Javascript

1 个答案: