Alex
Alex

Reputation: 2072

jQuery: navigate to another page by clicking a button

I'm learning JavaScript and jQuery. I'm trying to build a simple web page with buttons that navigate to another page upon click via a switch-case statement.

I've added a local jQuery script to my .html file, but nothing seems to happen when I click the buttons.

Demo can be found here: http://jsfiddle.net/VmYLy/

The html code is:

<head>
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

 $("input[type='button']").click(function() {
     switch(this.id) {
         case 'x':
             window.location.href = "http://google.com"; 
             break;
         case 'y': 
             window.location.href = "http://yahoo.com"; 
             break;
         case 'z': 
             window.location.href = "http://stackoverflow.com"; 
             break;
            }
        });    
</head>

<body>        
    <input type="button" value="google" style="width:120px" id="x"><br>
    <input type="button" value="yahoo" style="width:120px" id="y"><br>
    <input type="button" value="stackoverflow" style="width:120px" id="z"><br>
</body>

Upvotes: 0

Views: 8944

Answers (1)

T J
T J

Reputation: 43166

It works fine in fiddle. only prob i can think of is to wrap your code in ready(). This might not be causing problem in fiddle since you've selected onLoad option.

$(document).ready(function(){
    $("input[type='button']").click(function() {
        switch(this.id) {
            case 'x':window.location.href = "http://google.com"; break;
            case 'y': window.location.href="http://yahoo.com"; break;
            case 'z': window.location.href = "http://stackoverflow.com"; break;
        }
    });
})

Upvotes: 4

Related Questions