jQueryeasyui 中如何使用datetimebox 取兩個(gè)日期間相隔的天數(shù)
功能需求如下:
1) 使用 datetimebox 日期控件, 選擇開(kāi)始日期 startdate, 結(jié)束日期 leavedate ,然后求兩日期間相隔天數(shù) numdays ;
2) 天數(shù) x 補(bǔ)助 = 包干費(fèi)用; (numdays * allowance = def11 )
下面是效果圖:
一. form 表單:開(kāi)始時(shí)間,結(jié)束時(shí)間兩個(gè)都使用 onChange 事件;
<td>派遣時(shí)間:</td> <td><input class="easyui-datetimebox" id="startdate" name="startdate" data-options="onChange:onSelectT" /></input></td> <td>離開(kāi)客戶(hù)處時(shí)間:</td> <td><input class="easyui-datetimebox" id="leavedate" name="leavedate" data-options="onChange:onSelectT" /></input></td> <td>售后所用天數(shù):</td> <td><input class="easyui-numberbox" id="numdays" name="numdays" data-options="onChange:onSelectT" precision="0" min="0" readonly ="readonly"/></input> </td> <td>補(bǔ)助:</td> <td><input name="allowance" id="allowance" class="easyui-numberbox" precision="0" min="0"></td> <td>包干費(fèi)用:</td> <td><input name="def11" id="def11" class="easyui-numberbox" precision="0" min="0" readonly ="readonly"></td>
二.計(jì)算相隔天數(shù)
//計(jì)算日期方法: function onSelectT(d) { var sd = $('#startdate').datebox('getValue').replace(/-/g, '/'), ed = $('#leavedate').datebox('getValue').replace(/-/g, '/'); if (sd != '' && ed != '') { if (sd > ed) { $.messager.alert('警告','結(jié)束時(shí)間要 大于 開(kāi)始時(shí)間','warning'); } else { var totalMS = new Date(ed).getTime() - new Date(sd).getTime();//得到相差的毫秒數(shù) day = Math.ceil(totalMS / 1000 / 24 / 60 / 60);//得到相差天數(shù),不滿(mǎn)一天不算一天將Math.ceil改為Math.floor $("#numdays").numberbox("setValue", day); //所用天數(shù) */ } } }
三.計(jì)算費(fèi)用
$(function() { //(根據(jù) 售后天數(shù) *補(bǔ)助)計(jì)算包干費(fèi)用 $("input",$("#allowance").next("span")).blur(function(){//鼠標(biāo)離開(kāi) '補(bǔ)助' 欄后,觸發(fā) var adays =$("#numdays").numberbox('getValue');//天數(shù) var abz =$("#allowance").numberbox('getValue');//補(bǔ)助 var abaogan = adays * abz;//(售后天數(shù)*補(bǔ)助=包干費(fèi)用) $("#def11").numberbox('setValue', abaogan);//包干費(fèi)用 }); })
接下來(lái)是應(yīng)用 (一些需要注意的細(xì)節(jié)):
(1)定義全局變量 day
var day = 0;//默認(rèn)為 day = 0
(2)添加方法();
function addMethod() { initialise(); //調(diào)用初始化函數(shù) onSelectT();//計(jì)算相隔時(shí)間天數(shù) day = 0;// .form("clear");方法不能成功清除上次緩存。所以在添加方法中重新聲明 day = 0,作用是第二次點(diǎn)擊添加時(shí),將上次的天數(shù)重置為 0 天, <span style="white-space:pre"> </span>替代 .form("clear"); $('#editWindow').dialog('open').dialog('center').dialog('setTitle', '添加派遣單信息'); $('#eidtform').form("clear"); $("#allowance").numberbox("setValue", 0); //補(bǔ)助 $("#numdays").numberbox("setValue", 0); //添加默認(rèn)塞值 (所用天數(shù)) $("#def11").numberbox("setValue", 0); //包干費(fèi)用 $('#editWindow').window("open"); }
以上所述是小編給大家介紹的jQueryeasyui 中如何使用datetimebox 取兩個(gè)日期間相隔的天數(shù),希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
Jquery獲取radio選中值實(shí)例總結(jié)
在本篇文章里小編給大家分享了關(guān)于Jquery獲取radio選中值實(shí)例總結(jié)內(nèi)容,有興趣的朋友們可以學(xué)習(xí)下。2019-01-01JQuery對(duì)表格進(jìn)行操作的常用技巧總結(jié)
這篇文章主要介紹了JQuery對(duì)表格進(jìn)行操作的常用技巧,需要的朋友可以參考下2014-04-04運(yùn)用jQuery定時(shí)器的原理實(shí)現(xiàn)banner圖片切換
banner圖片切換效果,在一些企業(yè)網(wǎng)站上經(jīng)常會(huì)碰到,本文運(yùn)用jQuery定時(shí)器的原理實(shí)現(xiàn)banner圖片切換,感興趣的朋友可以學(xué)習(xí)下2014-10-10jquery 獲取標(biāo)簽名(tagName)示例代碼
如果是需要取到tagName后再進(jìn)行判斷,那么下面的代碼或許對(duì)大家有所幫助,感興趣的朋友不妨嘗試一下哈2013-07-07老司機(jī)帶你解讀jQuery插件開(kāi)發(fā)流程
jQuery庫(kù)中包括很多函數(shù),所以開(kāi)發(fā)插件的時(shí)候往往就需要注意命名空間和私有作用域等方面,下面就由Shawn Khameneh老司機(jī)帶你解讀jQuery插件開(kāi)發(fā)流程及相關(guān)注意點(diǎn).2016-05-05jQuery幫助之篩選查找 children([expr])
取得一個(gè)包含匹配的元素集合中每一個(gè)元素的所有子元素的元素集合。2011-01-01JQuery select控件的相關(guān)操作實(shí)現(xiàn)代碼
JQuery獲取和設(shè)置Select選項(xiàng)方法匯總?cè)缦拢枰呐笥芽梢詤⒖枷?/div> 2012-09-09最新評(píng)論