jQuery Mobile: tiempo y color de texto

Descripción

El tipo de entrada de tiempo permite al usuario introducir el tiempo (hora, minuto, segundos, fracciones de segundo) codificado de acuerdo con ISO 8601.

El tipo de entrada de color permite al usuario seleccionar un color en particular del cuadro de color mostrado.

Ejemplo

El siguiente ejemplo demuestra el uso de la entrada de tiempo y color 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>
      <form>
         <h2>Time Input Example</h2>
         <label for = "src">Time Input</label>
         <input type = "time" id = "src" data-clear-btn = "false">
         
         <label for = "src1">Clear the Time Field</label>
         <input type = "time" data-clear-btn = "true" id = "src1">

         <h2>Color Input Example</h2>
         <label for = "src2">Color Input</label>
         <input type = "color" id = "src2" data-clear-btn = "false">
         
         <label for = "src3">Clear the Color Field</label>
         <input type = "color" data-clear-btn = "true" id = "src3">
      </form>
   </body>
</html>

Salida

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

Guarde el código html anterior como textinput_time_color.html archivo en la carpeta raíz de su servidor.
Abra este archivo HTML como http: //localhost/textinput_time_color.html y se mostrará el siguiente resultado.

↰ Previous page