Exemple de liste avec barre de rechercher filtrante
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Exemple de liste avec barre de rechercher filtrante</title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" /> <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script> <script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script> </head> <body> <div data-role="page"> <div data-role="header"> <h1>Exemple de liste avec barre de rechercher filtrante</h1> </div><!-- /header --> <div data-role="content"> <ul data-role="listview" data-filter="true"> <li><a href="index.html">Acura</a></li> <li><a href="index.html">Audi</a></li> <li><a href="index.html">BMW</a></li> <li><a href="index.html">Cadillac</a></li> <li><a href="index.html">Chrysler</a></li> <li><a href="index.html">Dodge</a></li> <li><a href="index.html">Ferrari</a></li> <li><a href="index.html">Ford</a></li> <li><a href="index.html">GMC</a></li> <li><a href="index.html">Honda</a></li> <li><a href="index.html">Hyundai</a></li> <li><a href="index.html">Infiniti</a></li> <li><a href="index.html">Jeep</a></li> <li><a href="index.html">Kia</a></li> <li><a href="index.html">Lexus</a></li> <li><a href="index.html">Mini</a></li> <li><a href="index.html">Nissan</a></li> <li><a href="index.html">Porsche</a></li> <li><a href="index.html">Subaru</a></li> <li><a href="index.html">Toyota</a></li> <li><a href="index.html">Volkswagon</a></li> <li><a href="index.html">Volvo</a></li> </ul> </div><!-- /content --> <div data-role="footer"> <h4>Contenu du pied de page</h4> </div><!-- /footer --> </div><!-- /page --> </body> </html>
Voir le résultat : Exemple de liste avec barre de rechercher filtrante.