CTRL+CLICK Detection with jQuery

This shows an example of capturing a CTRL+click event

by David Underwood

HTML

<p>Click the blue block below to test click event and CTRL+click to test the CTRL+click event.</p>

<div id="myElement">
    Click Me
</div>

<p>Results:</p>
<div id="result"></div>

CSS

#result {
    width: 300px;
    height: 300px;
    background-color: #f0f0f0;
    overflow-y: scroll;
}

#myElement
{
    padding-top: 10px;
    text-align: center;
    width:100px; 
    height:30px; 
    background-color: blue;
    color: #ffffff;
}

JavaScript

$('#myElement').bind('click', function(event){ 
    if(event.ctrlKey) {
        console.log('ctrl+click');
        $('#result').append('ctrl+click<br/>');
    } else {
        console.log('click only');
        $('#result').append('click only<br/>');
    }
    $('#result').scrollTop($('#result')[0].scrollHeight);
  });