Form to jump to page

1.1k views Asked by At

How can I make a form that allows users to enter a number and then goes to example.com/page/# where # is what the user typed in? I want this for a pagination "jump to" option.

I can only use HTML and JavaScript

2

There are 2 answers

1
Christian On BEST ANSWER
<script type="text/javascript">
    function goToPage(){
        var page=document.getElementById('in').value; // value of input box
        page=page*1; // ensures page is numeric only
        location.href='http://www.example.com/page/'+page; // redirect to new url
    }
</script>
<input type="text" id="in"/>
<input type="button" onclick="goToPage();"/>
2
bobince On
<form id="jump" method="get" action="">
    <input type="text" id="jump-page"/>
    <input type="submit" value="Go"/>
</form>

<script type="text/javascript">
    document.getElementById('jump').onsubmit= function() {
        location.hash= document.getElementById('jump-page').value;
        return false;
    };
</script>

For page numbers you should probably prefix them like id="page-2" (to make a valid identifier) and then do location.hash= '#page-'+....