Over a million developers have joined DZone.

How to create a quick jump menu with jQuery

DZone's Guide to

How to create a quick jump menu with jQuery

· Web Dev Zone ·
Free Resource

Jumpstart your Angular applications with Indigo.Design, a unified platform for visual design, UX prototyping, code generation, and app development.

How to create a quick jump menu with jQuery This is part of my snippets library at https://github.com/lordspace/snippets/tree/master/js/quick_jump

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>    
<script type="text/javascript" charset="utf-8">
    $(document).ready(function() {
            // option 1 use a JS redirect in the current window
            //window.location.href = $(this).val();
            // option 2; set the 'action' of the form and submit it
            if ($(this).val() != '') {
                $('#site_quick_jump_form').attr('action', $(this).val()); // 
                $('#site_quick_jump_form').attr('target', '_blank'); // new window
                $('#site_quick_jump_form').submit(); // Go!
    }); // doc ready
<div class="site_quick_jump_container">
    <form id="site_quick_jump_form" method="get" action="">
    Go to: <select class="site_quick_jump">
                <option value="http://yahoo.com">Yahoo!</option>
                <option value="/product1.html">Product 1</option>
                <option value="/product2.html">Product 2</option>

From http://www.devcha.com/2011/08/how-to-create-quick-jump-menu-with.html

Take a look at an Indigo.Design sample application to learn more about how apps are created with design to code software.


Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}