Multi page function with links on drop-down

I have put together a multi page function, so there are multiple pages within the same webpage, and I would like the links to the multiple pages to be accessible via a drop-down rather than normal links. I have found a code for this, however it doesn't seem to be working for some reason.

HTML Code:

---

<div style='width:400px; height:400px; background-color:white; border-style:solid; border-color:#000000; border-width:1px; overflow:hidden;'>
<script>
 function goToPage(url)
 {
 if (url != "")
 {
 .open(url);
 }
 }
</script>
<form>
 <label>Select a page:</label>
 <select accesskey="S" onchange="goToPage(this.options(this.selectedIndex).value)">
 <option selected>Please select one</option>
 <option value="#page1">Page 1</option>
 <option value="#page2">Page 2</option>
 <option value="#page3">Page 3</option>
 <option value="#page4">Page4</option>
 </select>
</form>
       
        <a name='page1'></a>
        <div style='width:400px; height:400px; overflow:auto;'>
        this is page 1
        </div>
       
        <a name='page2'></a>
        <div style='width:400px; height:400px; overflow:auto;'>
        this is page 2
        </div>
       
        <a name='page3'></a>
        <div style='width:400px; height:400px; overflow:auto;'>
        this is page 3
        </div>
       
        <a name='page4'></a>
        <div style='width:400px; height:400px; overflow:auto;'>
        this is page 4
        </div>
</div>

---

Any help is greatly appreciated.
Thanks.

The problem would have to be with the line containing ".open(url);" since this isn't a valid function. My guess is there is something else that should be included with this code you found that declares that method.

In any case you can simply replace it with something like this to get it working:

Code:

---

window.location = String(window.location).replace(/\#.*$/, "") + url;

---

Quote:

---

Originally Posted by Sup3rkirby

The problem would have to be with the line containing ".open(url);" since this isn't a valid function. My guess is there is something else that should be included with this code you found that declares that method.

In any case you can simply replace it with something like this to get it working:

Code:

---

window.location = String(window.location).replace(/\#.*$/, "") + url;

---

---

I tried it, but it didn't work.:(

I just ran the code myself and there were two things I needed to mention. Firstly, the reason that code doesn't seem to work is due to the <select> fields onchange value. It should be onchange="goToPage(this.value)"

This will allow everything to function properly, however this is one more 'issue'. After more closely looking at your entire code I noticed each of your pages are contained within a <div> that has a fixed width/height and hidden overflow. Your little page-switching form is also contained within this <div>. For this reason, moving from one page to another in that <div> will end up hiding your page switching form (due to it being pushed outside of the visible box limits). I'm not sure if it's necessary to have it inside of that main <div> or not, but placing it just above would easily fix this issue.