实例代码“Ctrl+/”提示“F11/ESC”全屏 返回 格式化 恢复 运行
AخA
 
1
<!doctype html>
2
<html lang="en">
3
<head>
4
  <meta charset="utf-8">
5
  <title>jQuery UI 日期选择器（Datepicker） - 选择一个日期范围</title>
6
  <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
7
  <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
8
  <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
9
  <link rel="stylesheet" href="jqueryui/style.css">
10
  <script>
11
  $(function() {
12
    $( "#from" ).datepicker({
13
      defaultDate: "+1w",
14
      changeMonth: true,
15
      numberOfMonths: 3,
16
      onClose: function( selectedDate ) {
17
        $( "#to" ).datepicker( "option", "minDate", selectedDate );
18
      }
19
    });
20
    $( "#to" ).datepicker({
21
      defaultDate: "+1w",
22
      changeMonth: true,
23
      numberOfMonths: 3,
24
      onClose: function( selectedDate ) {
25
        $( "#from" ).datepicker( "option", "maxDate", selectedDate );
26
      }
27
    });
28
  });
29
  </script>
30
</head>
31
<body>
32
33
<label for="from">从</label>
34
<input type="text" id="from" name="from">
35
<label for="to">到</label>
36
<input type="text" id="to" name="to">
37
38
39
</body>
40
</html>