Question

I am working on a selection menu. I want the user to be able to select two different options and have something displayed depending on what they have selected. Right now, I am just using images to represent the selections. I am wondering if there is a way to see if a user has selected/clicked two of the images consecutively. After the user has clicked two pictures, I want them to be redirected to another page and have something displayed.

/*clicked on certain two images*/(function(){
    document.location.href="#page";
    $('option').css('display', 'inline');
});

Answer 1

Use a class to mark selection and after each click, check to see if two are selected:

$('img').click( function() {
   $(this).toggleClass('selected');

    if($('img.selected').length == 2) {
        alert("Two images selected!");
        // Or redirect to new page, etc.
    }
});

Demo:

http://jsfiddle.net/G9NXA/

This is, of course, a generic solution. You probably don’t want to use img as your selector, but some other class that defines your selectable images.

If you want to make sure the clicks/selections are consecutive clicks, simply clear the selection if the user clicks anywhere else:

Demo: http://jsfiddle.net/G9NXA/1/

And if you meant spatially consecutive, rather than temporally consecutive, here is another example:

Demo: http://jsfiddle.net/G9NXA/2/