快捷導(dǎo)航

使用js實(shí)現(xiàn)按鈕控制文本框加1減1應(yīng)用于小時(shí)+分鐘

更新時(shí)間：2013年12月09日 16:54:25 作者：

正如標(biāo)題所言使用js實(shí)現(xiàn)按鈕控制文本框加1減1，此類主要應(yīng)用于小時(shí)+分鐘，下面有個(gè)不錯(cuò)的示例，喜歡的朋友可以參考下

time.html代碼：

 
<!doctype html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<meta name="Generator" content="EditPlus®"> 
<meta name="Author" content=""> 
<meta name="Keywords" content=""> 
<meta name="Description" content=""> 
<title>Document</title> 
<script type="text/javascript" src="jquery-1.8.2.min.js"></script> 
<script type="text/javascript" src="time.js"></script> 
</head> 
<body> 
<input type="button" value="小時(shí)加" onClick="add_hour();"> 
<input type="text" value="00" id="hour"> 
<input type="button" value="小時(shí)減" onClick="sub_hour();"> 
<br/> 
<br/> 
<input type="button" value="分鐘加" onClick="add_minute();"> 
<input type="text" value="00" id="minute"> 
<input type="button" value="分鐘減" onClick="sub_minute();"> 
</body> 
</html> 

time.js代碼：

復(fù)制代碼代碼如下:

 
function add_num(a,b,c){ 

if(c<a){ 
c++; 
} 
else{ 
c=b; 
} 
if(c<=9&&c>=0){ 
c="0"+c; 
} 
return c; 
} 
function sub_num(a,b,c){ 
if(c>a){ 
c--; 
} 
else{ 
c=b; 
} 
if(c<=9&&c>=0){ 
c="0"+c; 
} 
return c; 
} 
function add_hour(){ 
var current_num=$("#hour").attr("value"); 
current_num=add_num(23,0,current_num); 
$("#hour").attr("value",current_num); 
} 
function sub_hour(){ 
var current_num=$("#hour").attr("value"); 
current_num=sub_num(0,23,current_num); 
$("#hour").attr("value",current_num); 
} 
function add_minute(){ 
var current_num=$("#minute").attr("value"); 
current_num=add_num(59,0,current_num); 
$("#minute").attr("value",current_num); 
} 
function sub_minute(){ 
var current_num=$("#minute").attr("value"); 
current_num=sub_num(0,59,current_num); 
$("#minute").attr("value",current_num); 
} 

您可能感興趣的文章:

相關(guān)文章

微信小程序?qū)崿F(xiàn)單選按鈕
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)單選按鈕，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-07-07
JavaScript下拉菜單功能實(shí)例代碼
這篇文章主要介紹了JavaScript下拉菜單實(shí)例代碼,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-03-03
JavaScript 2018 中即將迎來(lái)的新功能
JavaScript 2018 中即將迎來(lái)的新功能：異步生成器及更好的正則表達(dá)式。更多常規(guī)正則表達(dá)式功能大家跟隨小編一起通過(guò)本文學(xué)習(xí)吧
2018-09-09
JavaScript 判斷瀏覽器是否是IE
這篇文章主要介紹了JavaScript 判斷瀏覽器是否是IE，幫助大家更好的理解和學(xué)習(xí)前端知識(shí)，感興趣的朋友可以了解下
2021-02-02
JS組件Bootstrap Select2使用方法解析
這篇文章主要為大家詳細(xì)介紹了JS組件Bootstrap Select2使用方法，感興趣的小伙伴們可以參考一下
2016-05-05
javascript 事件加載與預(yù)加載
本文對(duì)JavaScript事件加載進(jìn)行了一些延伸思考。加載多個(gè)事件時(shí)，使用window.onload可能會(huì)導(dǎo)致一些不便，而通過(guò)偵聽(tīng)器等方法，則可以解決這些問(wèn)題。
2009-12-12
移動(dòng)端H5開(kāi)發(fā) Turn.js實(shí)現(xiàn)很棒的翻書(shū)效果
這篇文章主要為大家詳細(xì)介紹了Turn.js實(shí)現(xiàn)很棒的翻書(shū)效果，對(duì)Turn.js翻書(shū)效果的實(shí)現(xiàn)進(jìn)行總結(jié)，感興趣的小伙伴們可以參考一下
2016-06-06
javascript中的類,繼承,構(gòu)造函數(shù)詳解
這篇文章主要為大家詳細(xì)介紹了javascript中的類,繼承,構(gòu)造函數(shù)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助
2022-02-02
JavaScript Canvas實(shí)現(xiàn)驗(yàn)證碼
這篇文章主要為大家詳細(xì)介紹了JavaScript Canvas實(shí)現(xiàn)驗(yàn)證碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2018-08-08
JavaScript中的數(shù)據(jù)劫持和數(shù)據(jù)代理使用
文章主要介紹了數(shù)據(jù)劫持（Object.defineProperty）和數(shù)據(jù)代理（Proxy）兩種方式在JavaScript中的應(yīng)用,并通過(guò)生活中的例子來(lái)詳細(xì)解釋它們的工作原理和使用場(chǎng)景,文章還對(duì)比了兩種方式的優(yōu)缺點(diǎn),并指出了它們?cè)赩ue.js中的應(yīng)用
2025-02-02