jQuery Mobile - Marcado básico de casilla de verificación

Descripción

La casilla de verificación se puede crear utilizando el <input> elemento con un type = "checkbox"atributo y una etiqueta correspondiente. Incluya el elemento de entrada dentro del elemento de etiqueta para que estén asociados semánticamente.

Ejemplo

El siguiente ejemplo demuestra el uso de la casilla de verificación básica en jQuery Mobile.

<!DOCTYPE html>
<html>
   <head>
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      <link rel = "stylesheet" href = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
      <script src = "https://code.jquery.com/jquery-1.11.3.min.js"></script>
      <script src = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
   </head>

   <body>
      <div data-role = "page">
         <form>
            <label>
               <input type = "checkbox">CheckBox 1
            </label>
            
            <label>
               <input type = "checkbox">CheckBox 2
            </label>
            
            <label>
               <input type = "checkbox">CheckBox 3
            </label>
         </form>
      </div>
   </body>
</html>

Salida

Realicemos los siguientes pasos para ver cómo funciona el código anterior:

  • Guarde el código html anterior como checkbox_basic.html archivo en la carpeta raíz de su servidor.

  • Abra este archivo HTML como http: //localhost/checkbox_basic.html y se mostrará el siguiente resultado.