Question

我目前有这个脚本，它可以完成我现在想做的所有事情。它有一个下拉菜单，你选择goTo，你可以选择维基百科或其他网站列表。从那里它将改变当前存在的iFrame（例如微软）的价值到另一个网站（例如维基百科）。

但是我的问题是，在更改选项时，它会关闭连接并显示空白页面，直到我选择维基百科。我该如何解决这个问题？这是我目前的代码

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title></title>
  <link href="style.css" rel="stylesheet" />
  <script src="http://code.jquery.com/jquery-2.0.3.min.js" data-semver="2.0.3" data-require="jquery"></script>
  <script type="text/javascript" src="http://www.appelsiini.net/projects/chained/jquery.chained.js?v=0.9.10"></script>
  <script>
  function goToPage763(mySelect)
  {
  PageIndex2=mySelect.selectedIndex;
  {
  if
  ( 
  mySelect.options[PageIndex2].getAttribute('href') != "none"  
  )  
  {  
  //this is the key code in the JavaScript to open the new page in  
  //the iframe:-  
  frames['iframe2'].location.href = mySelect.options[PageIndex2].getAttribute('href');  
  }  
  }  
  }
  // Add your javascript here
  $(function(){
  $("#size").chained("#color");
  });
  </script>
</head>

<body>
<form name="form763">
  <select class="form-control" id="color">
    <option value="">choose options</option>
    <option value="27">Goto</option>
    <option value="26">Nothing</option>
  </select>
  <select class="form-control" id="size" name="select763" size="1" onchange="goToPage763(this.form.select763)">
<option value="">choose options</option>
    <option value="27" class="27" href="http://www.wikipedia.com">Wiki</option>
    <option value="26" class="26">Nothing</option>
  </select>
  </form>
  <iframe name="iframe2" src="http://www.microsoft.com" align="top" height="800px" width="95%" align="middle">
</body>

</html>

Answer 1

看看这是否能解决您的问题

    <!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="http://code.jquery.com/jquery-2.0.3.min.js"
        data-semver="2.0.3" data-require="jquery"></script>
    <script>
          function goToPage763(mySelect){
              frames['iframe2'].location.href = $(mySelect).val();
          }
    </script>
</head>

<body>
    <form name="form763">
        <select class="form-control" id="size" name="select763"
            size="1" onchange="goToPage763(this)">
            <option value="">choose options</option>
            <option value="http://www.wikipedia.com">Wiki</option>
            <option value="http://www.microsoft.com">Microsoft</option>
            <option value="https://www.wiktionary.org/">Wiktionary</option>
        </select>
    </form>
    <iframe name="iframe2" src="http://www.microsoft.com" align="top"
        height="800px" width="95%" align="middle">
</body>

</html>

Ajax下拉/上一个选项更改iframe

1 个答案: