use drop-down menu for linking pages in HTML in site.google-CodePudding

I want to use the dropdown menu on site.google to link different pages, but I don't know what to write inside the value field in order to make this code functioning well. Could you please assist me to figure out how I can do that!

 <!DOCTYPE html>
 <html>
 <body>

 <form>
 <select name="list" id="list" accesskey="target">
 <option value='none' selected>Choose a theme</option>
 <option value="what do I have to write here!">Page 1</option>
 <option value="#what do I have to write here!">Page 2</option>
 <option value="#what do I have to write here!">Page 3</option>
 </select>
 <input type=button value="Go" onclick="goToNewPage()" />
 </form>


 <script type="text/javascript">
 function goToNewPage()
 {
    var url = document.getElementById('list').value;
    if(url != 'none') {
        window.location = url;
    }
   }
  </script>

  </body>
  </html>

CodePudding user response：

You can create an anchor element and click it or use the window.open function with the _top parameter. Like so:

<body>

  <form>
    <select name="list" id="list" accesskey="target">
 <option value='none' selected>Choose a theme</option>
 <option value="https://google.com">Google</option>
 <option value="https://developers.google.com/">Developers</option>
 <option value="https://developers.google.com/apps-script">Apps Script</option>
 </select>
    <input type=button value="Go" onclick="goToNewPage()" />
  </form>
  <script>
    const list = document.getElementById('list')
  function goToNewPage(){
    // Alternative 1 window.open(list.value, '_top')
    // Alternative 2
    const a = document.createElement('a')
    a.href = list.value
    a.target = '_blank'
    a.click()
  }
  </script>

</body>