如何使用 select 选项更改 iframe src？

Question

I guess you can see the idea i have;) how can i make this work? Thanks;)

<select name="test" onchange="myFunction();" >
  <option value="index.html">Home</option>
  <option vaule="contact.html">Contact</option>
</select>

<script>
function myFunction() {
  document.getElementById("iframe").src = 'test.value';
}
</script>


<iframe id="iframe"></iframe>

Answer 1

You can use sel.value property

Here the code i would use:

<script>
function myFunction() {
  sel = document.getElementById("sel")
  if(sel.value === "index.html"){
      document.getElementById("iframe").src =    
'https://link';
  } else {
      document.getElementById("iframe").src = 
'https://anotherLink';
  }
}
</script>

Answer 2

easy just target your selectbox and get it's value using querySelector

try the snippet

 function myFunction() { var val = document.querySelector('select[name="test"]').options; document.getElementById("iframe").src = val[val.selectedIndex].value; console.log(document.getElementById("iframe").src); }

 <select name="test" onchange="myFunction();" > <option value="index.html">Home</option> <option value="contact.html">Contact</option> </select> <iframe id="iframe"></iframe>