使用js實現(xiàn)按鈕控制文本框加1減1應用于小時+分鐘
更新時間：2013年12月09日 16:54:25 作者：
正如標題所言使用js實現(xiàn)按鈕控制文本框加1減1，此類主要應用于小時+分鐘，下面有個不錯的示例，喜歡的朋友可以參考下
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="小時加" onClick="add_hour();">
<input type="text" value="00" id="hour">
<input type="button" value="小時減" 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代碼：
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);
}
復制代碼 代碼如下:
<!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="小時加" onClick="add_hour();">
<input type="text" value="00" id="hour">
<input type="button" value="小時減" 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代碼：
復制代碼 代碼如下:
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)單選按鈕，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-07-07
這篇文章主要介紹了JavaScript下拉菜單實例代碼,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-03-03
JavaScript 2018 中即將迎來的新功能：異步生成器及更好的正則表達式。更多常規(guī)正則表達式功能大家跟隨小編一起通過本文學習吧2018-09-09
這篇文章主要介紹了JavaScript 判斷瀏覽器是否是IE，幫助大家更好的理解和學習前端知識，感興趣的朋友可以了解下2021-02-02
這篇文章主要為大家詳細介紹了JS組件Bootstrap Select2使用方法，感興趣的小伙伴們可以參考一下2016-05-05
本文對JavaScript事件加載進行了一些延伸思考。加載多個事件時，使用window.onload可能會導致一些不便，而通過偵聽器等方法，則可以解決這些問題。2009-12-12
移動端H5開發(fā) Turn.js實現(xiàn)很棒的翻書效果
這篇文章主要為大家詳細介紹了Turn.js實現(xiàn)很棒的翻書效果，對Turn.js翻書效果的實現(xiàn)進行總結(jié)，感興趣的小伙伴們可以參考一下2016-06-06
javascript中的類,繼承,構(gòu)造函數(shù)詳解
這篇文章主要為大家詳細介紹了javascript中的類,繼承,構(gòu)造函數(shù)，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2022-02-02
這篇文章主要為大家詳細介紹了JavaScript Canvas實現(xiàn)驗證碼，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-08-08
JavaScript中的數(shù)據(jù)劫持和數(shù)據(jù)代理使用
文章主要介紹了數(shù)據(jù)劫持（Object.defineProperty）和數(shù)據(jù)代理（Proxy）兩種方式在JavaScript中的應用,并通過生活中的例子來詳細解釋它們的工作原理和使用場景,文章還對比了兩種方式的優(yōu)缺點,并指出了它們在Vue.js中的應用2025-02-02