使用 javascript 的 iframe src 选择菜单答案

【问题标题】：selection menu for iframe src using javascript使用 javascript 的 iframe src 选择菜单
【发布时间】：2015-05-23 01:34:39
【问题描述】：

我发现了如何使用 javascript 来更改 iframe src，但是当我创建一个允许您选择要加载的 url 的选择菜单时，即使您选择了不同的选项，它也只会加载菜单中的第一个选项网址。我让它工作了一次，但我做了一些更改，它不会让我一直回到撤消。这是我得到的：

<iframe src="http://jquery.com/" id="myFrame" width="500" height="500" scrolling="no" frameborder="0"></iframe>
<div>
  <select id="selected2">
    <option value="http://linux.com">1</option>
    <option value="http://microsoft.com">2</option>
    <option value="http://apple.com">3</option>
  </select>
  <button onclick="loadPages()">Click Me</button>
  <script>
    function loadPages() {
      var loc = dataCap;
      document.getElementById('myFrame').setAttribute('src', loc);
    }
    var dataCap = document.getElementById("selected2").value;
  </script>

【问题讨论】：

标签： javascript html iframe selection src

【解决方案1】：

问题是，当您的脚本执行时，您只会在第一次获得值。为了获取当前选定的值，您需要在单击按钮时正确获取该值，在 onclick 函数内。

http://jsfiddle.net/v74ypgwk/1/

<iframe src="http://jquery.com/" id="myFrame" width="500" height="500" scrolling="no" frameborder="0"></iframe>
<div>
<select id="selected2">
    <option value="http://linux.com">1</option>
    <option value="http://microsoft.com">2</option>
    <option value="http://apple.com">3</option>
</select>
<button onclick="loadPages()">Click Me</button>
<script>
var urlSelect = document.getElementById('selected2'),
    myFrame = document.getElementById('myFrame');
function loadPages() {
    var loc = urlSelect.value;
    // You can also do -> myFrame.src = loc;
    myFrame.setAttribute('src', loc);
}
</script>

【讨论】：