在引导下拉菜单中显示所选菜单[仅适用于使用 attr() 的第一个菜单选项]答案

【问题标题】：displaying the selected menu on boostrap drop down[only applies to first menu option&using attr()]在引导下拉菜单中显示所选菜单[仅适用于使用 attr() 的第一个菜单选项]
【发布时间】：2019-04-05 09:31:46
【问题描述】：

我想使用引导下拉菜单显示选定的菜单选项。

我能够选择第一个菜单选项并应用于引导下拉 btn。

但是，我无法在第一次单击后更改选定的菜单选项。

我很确定使用 attr() 是问题所在。

所以，我使用了 each() 但也没有用。

            <ul> 
                <li>.....</li>
                <li>.....</li>
                <li>.....</li>
                <li>
                  <div class="dropdown">
                  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    <img height="25" src="img/flag_english.png" id="selected">
                  </button>
                  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                    <a class="dropdown-item"><img value="jp" height="25" src="img/flag_japanese.png" class="language"></a>
                    <a class="dropdown-item"><img value="en" height="25" src="img/flag_english.png" class="language"></a>
                  </div>
                  </div>
                <li>
            </ul>

以下代码适用于第一个选项，即<a class="dropdown-item"><img value="jp" height="25" src="img/flag_japanese.png" class="language"></a>

 $('.dropdown-menu a img').on('click', ()=>{
  let flag = $('.language').attr('src');
  console.log(flag);
  $('#selected').attr('src', flag);
})

我也尝试过使用 each()

  $('.dropdown-menu a img').on('click', ()=>{
  $('.language').each(()=>{
    let flag = $('.language').attr('src');
  })
})

但这也不起作用。如何改进我的代码？还是我应该使用不同的方法？

【问题讨论】：

我还尝试按属性名称选择元素。 ` $('img[class=language]').on('click', ()=>{ let flag = $('this').attr('src'); console.log(flag); $( '#selected').attr('src', flag); })` 但也没有用...

标签： javascript jquery bootstrap-4

【解决方案1】：

你的语法错误应该是

 $('.dropdown-menu a img').on('click', function(){
     let flag = $(this).attr('src');
     console.log(flag);
     $('#selected').attr('src', flag);
 })

【讨论】：

感谢您的帮助。只是为了快速与您核对一下，我错的地方是 1) ()=> 2)$('this') ？我认为 function(){} 可以写成 ()=>{}