JS、JQ时间选择控件

JavaScript013

JS、JQ时间选择控件,第1张

wdatepicker

这个就很好用啊,我一般都用它,想只选小时和分钟,那就使用这样的代码就可以

<input type="text" id="mdate" onClick="WdatePicker({dateFmt:'HH:mm'})"/>

<head>

<title></title>

<script>

document.onkeydown = function(e) {

var e = window.event ? window.event : e

if (document.activeElement.id != "txt1")

return

if (e.keyCode == 38) {\\上键事件

var l = getTxt1CursorPosition()

if (l == 2 || l == 8 || l == 5)

return

if (l == 0 || l == 1) {

if (document.getElementById("txt1").value.substr(0, 2) == '24') {

alert('必须小于24小时')

return

}

var val = Number(document.getElementById("txt1").value.substring(0, 2)) + 1

if (val <10) {

document.getElementById("txt1").value = "0" + val + document.getElementById("txt1").value.substring(2, document.getElementById("txt1").value.length)

}

else {

document.getElementById("txt1").value = val + document.getElementById("txt1").value.substring(2, document.getElementById("txt1").value.length)

}

}

}

if (e.keyCode == 40) {\\下键事件

}

}

function getTxt1CursorPosition(){

var oTxt1 = document.getElementById("txt1")

var cursurPosition=-1

if(oTxt1.selectionStart){//非IE浏览器

cursurPosition= oTxt1.selectionStart

}else{//IE

var range = document.selection.createRange()

range.moveStart("character",-oTxt1.value.length)

cursurPosition=range.text.length

}

return cursurPosition

}

</script>

</head>

<body>

<div>

<input id="txt1" type="text" value="00:00:00" />

</div>

</body>

</html>

就不帮你写完了,你按这个思路继续做下键和分、秒就行了。

执行完后文本焦点上还有些小问题,你自己查下,很容易解决。