jquery-easyui是一款優(yōu)秀的前端UI開發(fā)工具，可以幫助開發(fā)者快速地創(chuàng)建高效、美觀的界面。其中，選擇時間段是一個常用的功能。下面我們來介紹使用jquery-easyui實現(xiàn)選擇時間段的方法。

首先，在頁面中引入所需的jquery-easyui文件：

<link rel="stylesheet" type="text/css" href="jquery-easyui-1.9.5/themes/default/easyui.css"><script type="text/javascript" src="jquery-1.10.2.min.js"></script><script type="text/javascript" src="jquery-easyui-1.9.5/jquery.easyui.min.js"></script>

接著，在html中添加一個input框，用于選擇時間段：

<input id="timeSection" class="easyui-datetimebox" labelPosition="left" style="width:200px">

最后，我們使用jquery-easyui提供的方法給input框添加選擇時間段的功能：

$('#timeSection').datetimebox({
showSeconds: false,
editable: false,
required: true,
panelWidth: 240,
formatter: function (date) {
return formatDate(date);
},
parser: function (s) {
if (!s)
return new Date();
return new Date(Date.parse(s.replace(/-/g, "/")));
}
});
function formatDate(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
var h = date.getHours();
var M = date.getMinutes();
var s = date.getSeconds();
return y + '-' + (m< 10 ? ('0' + m) : m) + '-' + (d< 10 ? ('0' + d) : d) + ' ' + (h< 10 ? ('0' + h) : h) + ':' + (M< 10 ? ('0' + M) : M) + ':' + (s< 10 ? ('0' + s) : s);
}

通過以上代碼，我們可以實現(xiàn)對時間段的選擇，并將所選時間段以指定的格式顯示在input框中。