Мобильный пользовательский интерфейс для времени

Я использую datetimepicker для ввода продолжительности времени в форме. Пользовательский интерфейс хорошо работает на компьютере, но работает плохо в мобильной среде. Я не смог найти хорошую альтернативу, которая хорошо работает на всех платформах для записи продолжительности.Мобильный пользовательский интерфейс для времени

Heres пример DateTimePicker

<div class="col-sm-6"> 
<div class="form-group"> 
    <div class="input-group date" id="datetimepicker1"> 
     <input type="text" class="form-control"> <span class="input-group-addon"> 
        <span class="glyphicon glyphicon-calendar"></span> 

$(function(){ 
$('#datetimepicker1').datetimepicker({ 
format: 'hh:mm:ss' 
}); 

});

И скрипку Например: http://jsfiddle.net/jagtx65n/

Можно ли заставить другой интерфейс в мобильном телефоне, который будет по-прежнему работать эффективно, или есть лучший способ сделай это?

источник

2016-04-16 Shauno

Я использовал следующий сборщик данных в моем проекте cordova.

Responsive jQuery DateTime Picker library for Web & Mobile

Это выглядит очень хорошо в моем мобильном view.A образец HTML кода с помощью этого плагина приводится ниже.

<!DOCTYPE html> 
<!-- 
To change this license header, choose License Headers in Project Properties. 
To change this template file, choose Tools | Templates 
and open the template in the editor. 
--> 
<html> 
    <head> 
     <title>TODO supply a title</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <link href="css/DateTimePicker.min.css" type="text/css" rel="stylesheet" /> 
     <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script> 
     <script src="js/DateTimePicker.min.js"></script> 
     <script> 
      $(document).ready(function() 
      { 
       $("#dtBox").DateTimePicker({ 
        "timeFormat": "hh:mm:ss AA" 
       }); 

      }); 
     </script> 
    </head> 
    <body> 
     <div><p>Time : </p> 
      <input type="text" data-field="time" readonly> 
      <div id="dtBox"></div> 
     </div> 

    </body> 
</html>

источник

2016-04-17 07:54:37

Спасибо @Kiran Muralee, что выглядит красиво, но я на самом деле использую это для ввода продолжительности времени, а не времени. Мне также нужно, чтобы он находился в hh: mm: ss (в этом случае важны секунды). – Shauno

Вполне возможно, что вы можете подключиться к плагину. Просто используйте «timeFormat»: «hh: mm: ss AA». Обратитесь к этой ссылке для получения более подробной информации. Http://curioussolutions.github.io/DateTimePicker/. Я отредактировал свой ответ включить образец html-кода с помощью плагина. –

Мобильный пользовательский интерфейс для времени

ответ

Смежные вопросы