📅 最后修改于: 2023-12-03 14:43:20.462000 🧑 作者: Mango
jQWidgets jqxCalendar 是一个基于 jQuery 的日期选择控件。getRange() 方法是该控件中的一个重要方法，可用于获取 jqxCalendar 中当前选择的日期区间。
getRange(): { from: Date, to: Date }
无
一个对象，包含两个属性：
from: 开始日期，Date 类型to: 结束日期，Date 类型该方法返回技术选择的日期区间，如果未选择区间，则返回当天的日期。
// 获取 jqxCalendar 实例（首先需要在页面中引入 jQWidgets 库和 jQWidgets 主题文件）
let jqxCalendar = $('#jqxCalendar').jqxCalendar({
width: 220,
height: 220
});
// 获取日期区间
let range = jqxCalendar.jqxCalendar('getRange');
console.log(range.from, range.to);
此时，控制台将输出当前选择的日期区间。
以下是一个简单的示例，演示如何使用 getRange() 方法获取当前的日期区间。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>使用 jQWidgets jqxCalendar getRange() 方法</title>
<link rel="stylesheet" href="jqx.base.css" type="text/css" />
<script type="text/javascript" src="jquery-3.5.1.min.js"></script>
<script type="text/javascript" src="jqx-all.js"></script>
</head>
<body>
<div id="jqxCalendar"></div>
<script type="text/javascript">
// 获取 jqxCalendar 实例
let jqxCalendar = $('#jqxCalendar').jqxCalendar({
width: 220,
height: 220
});
// 当选择日期时，获取当前的日期区间
jqxCalendar.on('valueChanged', function (event) {
let range = jqxCalendar.jqxCalendar('getRange');
console.log(range.from, range.to);
})
</script>
</body>
</html>
当选择日期时，控制台将输出当前选择的日期区间。