2015-10-16 68 views
1

我的日期選擇器只能向下滾動/長達20年,僅適用於例如2005年 - 2025年 我希望它是1935年至2025年。是否可以更改或編輯它?Date:Year Scrolldown/up

那麼這裏的代碼謝謝你!

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>jQuery UI Datepicker - Select a Date Range</title> 
 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
 
    <script> 
 
    $(function() { 
 
    $("#from").datepicker({ 
 
     defaultDate: "+10w", 
 
     changeMonth: true, 
 
\t changeYear: true, 
 
     numberOfMonths: 1, 
 
     onClose: function(selectedDate) { 
 
     $("#to").datepicker("option", "minDate", selectedDate); 
 
     } 
 
    }); 
 
    $("#to").datepicker({ 
 
     defaultDate: "+10w", 
 
     changeMonth: true, 
 
\t changeYear: true, 
 
     numberOfMonths: 1, 
 
     onClose: function(selectedDate) { 
 
     $("#from").datepicker("option", "maxDate", selectedDate); 
 
     } 
 
    }); 
 
    }); 
 
    </script> 
 
</head> 
 
<body> 
 
    
 
<label for="from">From</label> 
 
<input type="text" id="from" name="from"> 
 
<label for="to">to</label> 
 
<input type="text" id="to" name="to"> 
 
    
 
    
 
</body> 
 
</html>

+0

如果選擇了一個早期的一年,今年的榜單將在下次你點擊它是不同的,會讓你選擇更早的年份。這足夠嗎?或者,您是否希望它在早些年第一次點擊年度組合框時顯示?請記住,如果你使它太大,它可能會在PC上垂直蔓延,用戶可能需要滾動才能找到他們想要的值。 –

+0

那麼它對我來說效率不高,因爲它的生日 – Vista

回答

4

使用yearRange選項:

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>jQuery UI Datepicker - Select a Date Range</title> 
 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
 
    <script> 
 
    $(function() { 
 
    $("#from").datepicker({ 
 
     defaultDate: "+10w", 
 
     changeMonth: true, 
 
\t changeYear: true, 
 
     numberOfMonths: 1, 
 
     yearRange: '1935:1997', 
 
     onClose: function(selectedDate) { 
 
     $("#to").datepicker("option", "minDate", selectedDate); 
 
     } 
 
    }); 
 
    $("#to").datepicker({ 
 
     defaultDate: "+10w", 
 
     changeMonth: true, 
 
\t changeYear: true, 
 
     numberOfMonths: 1, 
 
     yearRange: '1935:1997' , 
 
     onClose: function(selectedDate) { 
 
     $("#from").datepicker("option", "maxDate", selectedDate); 
 
     } 
 
    }); 
 
    }); 
 
    </script> 
 
</head> 
 
<body> 
 
    
 
<label for="from">From</label> 
 
<input type="text" id="from" name="from"> 
 
<label for="to">to</label> 
 
<input type="text" id="to" name="to"> 
 
    
 
    
 
</body> 
 
</html>

+1

它的工作原理!謝謝! – Vista

+0

樂意幫忙:) – rofls

+0

1935-1997而不是1935-2015我該怎麼辦? :) – Vista