time input with fallback

by Wray Bowling

HTML

<script src="http://modernizr.com/downloads/modernizr-latest.js"></script>
<input id="a" type="time" />
    
<select id="b">
<option>12:00 AM (midnight)</option>
<option>12:30 AM</option>
<option>1:00 AM</option>
<option>1:30 AM</option>
<option>2:00 AM</option>
<option>2:30 AM</option>
<option>3:00 AM</option>
<option>3:30 AM</option>
<option>4:00 AM</option>
<option>4:30 AM</option>
<option>5:00 AM</option>
<option>5:30 AM</option>
<option>6:00 AM</option>
<option>6:30 AM</option>
<option>7:00 AM</option>
<option>7:30 AM</option>
<option>8:00 AM</option>
<option>8:30 AM</option>
<option>9:00 AM</option>
<option>9:30 AM</option>
<option>10:00 AM</option>
<option>10:30 AM</option>
<option>11:00 AM</option>
<option>11:30 AM</option>
<option>12:00 PM (noon)</option>
<option>12:30 PM</option>
<option>1:00 PM</option>
<option>1:30 PM</option>
<option>2:00 PM</option>
<option>2:30 PM</option>
<option>3:00 PM</option>
<option>3:30 PM</option>
<option>4:00 PM</option>
<option>4:30 PM</option>
<option>5:00 PM</option>
<option>5:30 PM</option>
<option>6:00 PM</option>
<option>6:30 PM</option>
<option>7:00 PM</option>
<option>7:30 PM</option>
<option>8:00 PM</option>
<option>8:30 PM</option>
<option>9:00 PM</option>
<option>9:30 PM</option>
<option>10:00 PM</option>
<option>10:30 PM</option>
<option>11:00 PM</option>
<option>11:30 PM</option>
</select>

CSS

.disabled{
    display:none;
}

JavaScript

var time_tags = document.querySelectorAll('input[type=time]');
console.log(time_tags);
console.log(time_tags[0].value);

//time_tags[0].

var time_input = true;

 if(navigator.userAgent.match(/(Android (1.0|1.1|1.5|1.6|2.0|2.1))|(Windows Phone (OS 7|8.0))|(XBLWP)|(ZuneWP)|(w(eb)?OSBrowser)|(webOS)|(Kindle\/(1.0|2.0|2.5|3.0))/)) {
     time_input = false;
 }
/*
if(time_input){
    document.getElementById('b').classList.add('disabled');
}else{
    document.getElementById('a').classList.add('disabled');
}*/

var webview_time = webview.getSettings().setUserAgentString("user-agent-string");

alert(webview_time);