简体   繁体   中英

Case-sensitive Live Search on a Table with jQuery

I have a Live Search on a Table using jQuery. It works really well but is not case sensitive so jim will not show the same as Jim .

Demo: http://jsfiddle.net/qxks62x9/

 $("#search").on("keyup", function() { var value = $(this).val(); $("table tr").each(function(index) { if (index !== 0) { $row = $(this); var id = $.map($row.find('td'), function(element) { return $(element).text() }).join(' '); if (id.indexOf(value) <0) { $row.hide(); } else { $row.show(); } } }); }); 
 table, tr, td, th{ border: 1px solid blue; padding: 2px; } table th{ background-color: #999999; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr><th>Forename</th><th>Surname</th><th>Extension</th></tr> <tr><td>Jim</td><td>Carey</td><td>1945</td></tr> <tr><td>Michael</td><td>Johnson</td><td>1946</td></tr> </table> <br /> <input type="text" id="search" placeholder=" live search"></input> 

You can just lowercase both strings.

Fiddle: https://jsfiddle.net/maq2xmrv/

  • (id.toLowerCase().indexOf(value.toLowerCase()) < 0)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM