How can I make an HTML multiple select act like the control button is held down always

Question

I have a web application I\'m working on that requires a HTML multiple select element operates like the control key is held down at all times. I.e. click on an option will

Answer 1

Try this out. You can store the option values in an object and use the click action to update the object then apply the changes to the select.

Demo

http://jsfiddle.net/iambriansreed/BSdxE/

HTML

    1
    2
    3
    4
​

JavaScript

$('.select-toggle').each(function(){    
    var select = $(this), values = {};    
    $('option',select).each(function(i, option){
        values[option.value] = option.selected;        
    }).click(function(event){        
        values[this.value] = !values[this.value];
        $('option',select).each(function(i, option){            
            option.selected = values[option.value];        
        });    
    });
});​