Home/ Questions/Q 157961
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-11T10:35:50+00:00

In GMail, the user can click on one checkbox in the email list, hold

  • 0

In GMail, the user can click on one checkbox in the email list, hold down the Shift key, and select a second checkbox. The JavaScript will then select/unselect the checkboxes that are between the two checboxes.

I am curious as to how this is done? Is this JQuery or some basic (or complex) JavaScript?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. I wrote a self-contained demo that uses jquery:

    $(document).ready(function() {     var $chkboxes = $('.chkbox');     var lastChecked = null;      $chkboxes.click(function(e) {         if (!lastChecked) {             lastChecked = this;             return;         }          if (e.shiftKey) {             var start = $chkboxes.index(this);             var end = $chkboxes.index(lastChecked);              $chkboxes.slice(Math.min(start,end), Math.max(start,end)+ 1).prop('checked', lastChecked.checked);         }          lastChecked = this;     }); });
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'></script> <html> <head> </head> <body>     <input type='checkbox' id='id_chk1' class='chkbox' value='1' />Check 1<br/>     <input type='checkbox' id='id_chk2' class='chkbox' value='2' />Check 2<br/>     <input type='checkbox' id='id_chk3' class='chkbox' value='3' />Check 3<br/>     <input type='checkbox' id='id_chk4' class='chkbox' value='4' />Check 4<br/>     <input type='checkbox' id='id_chk5' class='chkbox' value='5' />Check 5<br/>     <input type='checkbox' id='id_chk6' class='chkbox' value='6' />Check 6<br/>     <input type='checkbox' id='id_chk7' class='chkbox' value='7' />Check 7<br/> </body> </html>

    • 0