title: select checkbox with enter key
body: <p>I have a few checkboxes that I need to be selected with the enter key instead of the space bar when it has focus. I have the code below that works for one check box, but I need multiple checkboxes. I know the id tag needs to be unique, but I'm not sure how to do it.</p>
  
  <pre><code>    $(document).ready(function () {
      $('#mycheckbox').on('keypress', function (event) {
          if (event.which === 13) {
              this.checked = !this.checked;
          }
      });
  });
  
  &lt;input type="checkbox" name="Colors" value="Bike" id="mycheckbox"&gt;My text&lt;br&gt;
  </code></pre>
  
  <p>I'm trying to get this to work on all the checkboxes not just the one with the mycheckbox id.</p>
  
  <p>Here's my full code so far:</p>
  
  <p>`</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript" src="http://code.jquery.com/jquery-
  
  latest.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(document).ready(function () {
      $('input:checkbox').on('keypress', function (event) {
          if (event.which === 13) {
              $(this).prop('checked', !$(this).prop('checked'));
          }
      });
  });
  &lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;script 
  
  src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/
  
  script&gt;
  &lt;textarea class="textfield" id="form1" name="form1"&gt;My text 
  
  here&lt;/textarea&gt;
  &lt;div class="taglist"&gt;
    &lt;label&gt;&lt;input type="checkbox" value="Value 1"&gt;Value 1&lt;/label&gt;
    &lt;label&gt;&lt;input type="checkbox" value="Value 2"&gt;Value 2&lt;/label&gt;
    &lt;label&gt;&lt;input type="checkbox" value="Value 3"&gt;Value 3&lt;/label&gt;
    &lt;label&gt;&lt;input type="checkbox" value="Value 4"&gt;Value 4&lt;/label&gt;
    &lt;label&gt;&lt;input type="checkbox" value="Value 5"&gt;Value 5&lt;/label&gt;
  &lt;/div&gt;
  &lt;script type="text/javascript"&gt;
  function updateTextArea() {
    var allVals = $('#form1').data('initialVal'),
        lineCount = 1;
    $('.taglist :checked').each(function(i) {
      allVals+= (i != 0 || allVals.length &gt; 0 ? "\r\n" : "") + $(this).val
  
  ();
      lineCount++;
    });
    $('#form1').val(allVals).attr('rows', lineCount);
  
  }
  $(function() {
    $('.taglist input').click(updateTextArea);
  
    $('#form1').data('initialVal', $('#form1').val());
    updateTextArea();
  });
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>`</p>