jQuery Form How to - Shift click to grab focus and set value








Question

We would like to know how to shift click to grab focus and set value.

Answer


<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'
  src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script type='text/javascript'>
$(window).load(function(){<!--   w w w. j a v  a  2s .  c  om-->
 $(document).on('keyup click', function(e){
       if (e.shiftKey) {
           $('input#search').focus()
           $('input#search').val(e.target.id)
       }
    })
});
</script>
</head>
<body>
  <input type="text" id="search">
  <ul>
    <li id="first">first</li>
    <li id="second">second</li>
    <li id="third">third</li>
    <li id="fourth">fourth</li>
  </ul>
</body>
</html>

The code above is rendered as follows: