Javascript 如何在html中使用onchange事件设置下拉值中的链接

这里介绍如何在html中使用OnChange事件在下拉列表中设置不同的锚定标记

 <form method="post">
 <select onchange="$('#imageToSwap').attr('src',this.options[this.selectedIndex].value);">
  <option value="http://dummy.com/images/button1.png" selected>Test1</option>
 <option value="http://dummy.com/images/button2.png">Test2</option>
 </select> 
 </form>


 Test1:
 <a href="https://link1.com"><img id="imageToSwap" class="class1" src="http://dummy.com/images/button1.png"></a>

 Test2:
<a href="https://link2.com"><img id="imageToSwap" class="class1" src="http://dummy.com/images/button2.png"></a>

测试1
测试2
测试1：
测试2：

通过替换图像的id修改了代码：

<form method="post">
 <select onchange="$('#imageToSwap').attr('src',this.options[this.selectedIndex].value);">
  <option value="http://dummy.com/images/button1.png" selected>Test1</option>
 <option value="http://dummy.com/images/button2.png">Test2</option>

测试1
测试2

测试1：

 <a href="https://link1.com"><img id="imageToSwap1" class="class1" src="http://dummy.com/images/button1.png"></a>

测试2：

<a href="https://link2.com"><img id="imageToSwap2" class="class1" src="http://dummy.com/images/button2.png"></a>

在您的案例中，两个元素不得具有相同的id（ImageToSwap）。使用不同的Id或使用类。@NikhilBatra和你说的一样。试试看