Home > Web Front-end > JS Tutorial > JQuery datepicker usage_jquery

JQuery datepicker usage_jquery

WBOY
Release: 2016-05-16 18:06:35
Original
1561 people have browsed it

Official address: http://docs.jquery.com/UI/Datepicker, official example: http://jqueryui.com/demos/datepicker/ .

A good address for DIY jQuery UI interface effect sitehttp://jqueryui.com/themeroller/

Basic usage of DatePicker:

Copy code The code is as follows:








<script> <br>$(document).ready(function() { <br>$("#datepicker").datepicker(); <br>}); <br>< /script> <br></head> <br><body style="font-size:62.5%;"> <br><br><div type="text" id="datepicker"&gt ;</div> <br><br></body> <br></html> <br> </div> <br>DatePicker supports mouse click to select dates, and the selection can also be controlled through the keyboard: <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="9949" class="copybut" id="copybut9949" onclick="doCopy('code9949')"><u>Copy code</u></a></span> The code is as follows:</div> <div class="codebody" id="code9949"> <br>page up/down - previous month, next month<br>ctrl page up/down - previous year, next year<br>ctrl home - current month or last opened date<br>ctrl left/right - previous day, next day<br>ctrl up/down - Previous week, next week <br>enter - confirm the selected date <br>ctrl end - close and clear the selected date <br>escape - close and cancel the selection <br> </div> <br>Useful functions: <br> <div class="codetitle"> <span><a style="CURSOR: pointer" data="87923" class="copybut" id="copybut87923" onclick="doCopy('code87923')"><u>Copy code</u></a></span> The code is as follows:</div> <div class="codebody" id="code87923"> <br>$.datepicker.setDefaults(settings) - Global settings for the date picker plug-in Parameters. <br>$.datepicker.formatDate( format, date, settings) - Format the date string for display <br>$.datepicker.iso8601Week( date ) - Give a date, and it is indeed the first day of the year Weeks<br>$.datepicker.parseDate(format, value, settings) - Get the date string according to the specified format<br> </div> <br>Date format: <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="27444" class="copybut" id="copybut27444" onclick="doCopy('code27444')"><u>Copy code</u></a></span> The code is as follows:</div> <div class="codebody" id="code27444"> <br>d - the day of the month (without leading zeros) <br>dd - the day of the month ( two digits) <br>o - day of the year (no leading zero) <br>oo - day of the year (three digits) <br>D - day name short <br>DD - day name long <br>m - month (without leading zero) <br>mm - month (two digits) <br>M - month name short <br>MM - month name long <br>y - year (two digits) digits) <br>yy - year (four digits) <br>@ - Unix timestamp (from 01/01/1970) <br>'...' - text <br>'' - single quote<br> (Other) - text <br> </div> <br><br>Other standard date formats: <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="8881" class="copybut" id="copybut8881" onclick="doCopy('code8881')"><u>Copy code</u></a></span> The code is as follows: </div> <div class="codebody" id="code8881"> <br>ATOM - 'yy-mm-dd' (Same as RFC 3339/ISO 8601) <br>COOKIE - 'D, dd M yy' <br>ISO_8601 - 'yy- mm-dd' <br>RFC_822 - 'D, d M y' <br>RFC_850 - 'DD, dd-M-y' <br>RFC_1036 - 'D, d M y <br>RFC_1123 - 'D, d M yy ' <br>RFC_2822 - 'D, d M yy' <br>RSS - 'D, d M y' <br>TIMESTAMP - '@' <br>W3C - 'yy-mm-dd' <br> </div> <br><br>Parameter (Parameter name: Parameter type: Default value) <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="91127" class="copybut" id="copybut91127" onclick="doCopy('code91127')"><u>Copy code </u></a></span> The code is as follows: </div> <div class="codebody" id="code91127"> <br>altField : String : '' <br>Synchronize the selected date to another field, and use altFormat to display date strings in different formats. <br>Initial: $('.selector').datepicker({ altField: '#actualDate' }); <br>Get: var altField = $('.selector').datepicker('option', 'altField' ); <br>Settings: $('.selector').datepicker('option', 'altField', '#actualDate'); <br><br>altFormat : String : '' <br>When altField is set In case of displaying date format in another field. <br>Initial: $('.selector').datepicker({ altFormat: 'yy-mm-dd' }); <br>Get: var altFormat = $('.selector').datepicker('option', 'altFormat'); <br>Settings: $('.selector').datepicker('option', 'altFormat', 'yy-mm-dd'); <br><br>appendText : String : '' <br>Add the specified string after the domain of the date plug-in. <br>Initial: $('.selector').datepicker({ appendText: '(yyyy-mm-dd)' }); <br>Get: var appendText = $('.selector').datepicker('option ', 'appendText'); <br>Settings: $('.selector').datepicker('option', 'appendText', '(yyyy-mm-dd)'); <br><br>buttonImage : String : '' <br>Set the picture of the pop-up button. If it is not empty, the text of the button will become the alt attribute and will not be displayed directly. <br>Initial: $('.selector').datepicker({ buttonImage: '/images/datepicker.gif' }); <br>Get: var buttonImage = $('.selector').datepicker('option' , 'buttonImage'); <br>Settings: $('.selector').datepicker('option', 'buttonImage', '/images/datepicker.gif'); <br><br>buttonImageOnly : Boolean : false <br>Set to true to place an image after the field to use as the trigger without it appearing on a button. <br>Initial: $('.selector').datepicker({ buttonImageOnly: true }); <br> Get: var buttonImageOnly = $('.selector').datepicker('option', 'buttonImageOnly'); <br>Setting: $('.selector').datepicker('option', 'buttonImageOnly', true); <br><br>buttonText : String : '...' <br>Set the text content of the trigger button. <br>Initial: $('.selector').datepicker({ buttonText: 'Choose' }); <br>Get: var buttonText = $('.selector').datepicker('option', 'buttonText') ; <br>Settings: $('.selector').datepicker('option', 'buttonText', 'Choose'); <br><br>changeMonth : Boolean : false <br>Settings allow selection through the drop-down list month. <br>Initial: $('.selector').datepicker({ changeMonth: true }); <br>Get: var changeMonth = $('.selector').datepicker('option', 'changeMonth'); <br>Settings: $('.selector').datepicker('option', 'changeMonth', true); <br><br>changeYear : Boolean : false <br>Settings allow year selection through the drop-down list. <br>Initial: $('.selector').datepicker({ changeYear: true }); <br>Get: var changeYear = $('.selector').datepicker('option', 'changeYear'); <br>Settings: $('.selector').datepicker('option', 'changeYear', true); <br><br>closeTextType: StringDefault: 'Done' <br>Set the text content of the close button, this button It needs to be displayed through the setting of showButtonPanel parameters. <br>Initial: $('.selector').datepicker({ closeText: 'X' }); <br>Get: var closeText = $('.selector').datepicker('option', 'closeText') ; <br>Settings: $('.selector').datepicker('option', 'closeText', 'X'); <br><br>constrainInput : Boolean : true <br>If set to true, the constraint The current input date format. <br>Initial: $('.selector').datepicker({ constrainInput: false }); <br>Get: var constrainInput = $('.selector').datepicker('option', 'constrainInput'); <br>Settings: $('.selector').datepicker('option', 'constrainInput', false); <br><br>currentText : String : 'Today' <br>Set the text content of today's button, this button It needs to be displayed through the setting of showButtonPanel parameters. <br>Initial: $('.selector').datepicker({ currentText: 'Now' }); <br>Get: var currentText = $('.selector').datepicker('option', 'currentText') ; <br>Settings: $('.selector').datepicker('option', 'currentText', 'Now'); <br><br>dateFormat : String : 'mm/dd/yy' <br>Settings The display format of date strings. <br>Initial: $('.selector').datepicker({ dateFormat: 'yy-mm-dd' }); <br>Get: var dateFormat = $('.selector').datepicker('option', 'dateFormat'); <br>Settings: $('.selector').datepicker('option', 'dateFormat', 'yy-mm-dd'); <br><br>dayNames : Array : ['Sunday ', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'] <br>Set the name of each day of the week, starting from Sunday. This content is displayed when the dateFormat is used, and when the mouse is moved to the head of the row in the calendar. <br>Initial: $('.selector').datepicker({ dayNames: ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'] }); <br>Get: var dayNames = $('.selector').datepicker('option', 'dayNames'); <br>Set: $('.selector').datepicker('option', 'dayNames', ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi']); <br><br>dayNamesMin : Array : ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'] <br>Set the abbreviation for each day of the week, starting from Sunday. This content is displayed when used in dateFormat. The row header in the previous calendar is displayed. .<br>Initial: $('.selector').datepicker({ dayNamesMin: ['Di', 'Lu', 'Ma', 'Me', 'Je', 'Ve', 'Sa'] }); <br>Get: var dayNamesMin = $('.selector').datepicker('option', 'dayNamesMin'); <br>Set: $('.selector').datepicker('option', 'dayNamesMin', ['Di', 'Lu', 'Ma', 'Me', 'Je', 'Ve', 'Sa']); <br><br>dayNamesShort : Array : ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'] <br>Set the abbreviation for each day of the week, starting from Sunday. This content is displayed when used in dateFormat. It is displayed in the row header in the previous calendar. . <br>Initial: $('.selector').datepicker({ dayNamesShort: ['Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam'] }); <br>Get: var dayNamesShort = $('.selector').datepicker('option', 'dayNamesShort'); <br>Set: $('.selector').datepicker('option', 'dayNamesShort', ['Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam']); <br><br>defaultDate : Date, Number, String : null <br>Settings The date selected when it is first displayed after loading by default. It can be a Date object, a number (counting from today, for example 7), or a valid string ('y' represents year, 'm' represents month, 'w' represents week, 'd' represents day, for example: '1m 7d'). <br>Initial: $('.selector').datepicker({ defaultDate: 7 }); <br>Get: var defaultDate = $('.selector').datepicker('option', 'defaultDate'); <br>Settings: $('.selector').datepicker('option', 'defaultDate', 7); <br><br>duration : String, Number : 'normal' <br>Set the display of the date control expansion animation Time, the optional options are "slow", "normal", and "fast", '' represents immediately, and the number represents the number of milliseconds. <br>Initial: $('.selector').datepicker({ duration: 'slow' }); <br>Get: var duration = $('.selector').datepicker('option', 'duration') ; <br>Settings: $('.selector').datepicker('option', 'duration', 'slow'); <br><br>firstDay : Number : 0 <br>Set the first day of the week . Sunday is 0, Monday is 1, and so on. <br>Initial: $('.selector').datepicker({ firstDay: 1 }); <br>Get: var firstDay = $('.selector').datepicker('option', 'firstDay'); <br>Settings: $('.selector').datepicker('option', 'firstDay', 1); <br><br>gotoCurrent : Boolean : false <br>If set to true, when the day button is clicked, Will move to the currently selected date, not today. <br>Initial: $('.selector').datepicker({ gotoCurrent: true }); <br>Get: var gotoCurrent = $('.selector').datepicker('option', 'gotoCurrent'); <br>Settings: $('.selector').datepicker('option', 'gotoCurrent', true); <br><br>hideIfNoPrevNext : Boolean : false <br>Set when there is no previous/next selectable In this case, hide the corresponding button. (Default is not available) <br>Initial: $('.selector').datepicker({ hideIfNoPrevNext: true }); <br>Get: var hideIfNoPrevNext = $('.selector').datepicker('option', 'hideIfNoPrevNext'); <br>Settings: $('.selector').datepicker('option', 'hideIfNoPrevNext', true); <br><br>isRTL : Boolean : false <br>If set to true, Then all text is from right to left. <br>Initial: $('.selector').datepicker({ isRTL: true }); <br>Get: var isRTL = $('.selector').datepicker('option', 'isRTL'); <br>Settings: $('.selector').datepicker('option', 'isRTL', true); <br><br>maxDate : Date, Number, String : null <br>Set a maximum selectable date . It can be a Date object, a number (counting from today, for example 7), or a valid string ('y' represents year, 'm' represents month, 'w' represents week, 'd' represents day, for example: '1m 7d'). <br>Initial: $('.selector').datepicker({ maxDate: ' 1m 1w' }); <br>Get: var maxDate = $('.selector').datepicker('option', 'maxDate' ); <br>Settings: $('.selector').datepicker('option', 'maxDate', ' 1m 1w'); <br>$('.selector').datepicker('option', 'maxDate ', '12/25/2012'); <br><br>minDate : Date, Number, String : null <br>Set a minimum optional date. It can be a Date object, a number (counting from today, for example 7), or a valid string ('y' represents year, 'm' represents month, 'w' represents week, 'd' represents day, for example: '1m 7d'). <br>Initial: $('.selector').datepicker({ minDate: new Date(2007, 1 - 1, 1) }); <br>Get: var minDate = $('.selector').datepicker( 'option', 'minDate'); <br>Settings: $('.selector').datepicker('option', 'minDate', new Date(2007, 1 - 1, 1)); <br>$( '.selector').datepicker('option', 'minDate', '12/25/2012'); <br><br>monthNames : Array : ['January', 'February', 'March', 'April ', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] <br>Set the names of all months. <br>Initial: $('.selector').datepicker({monthNames:['Januar','Februar','Marts','April','Maj','Juni','Juli','August' ,'September','Oktober','November','December']}); <br>Get: var monthNames = $('.selector').datepicker('option', 'monthNames'); <br> Settings: $('.selector').datepicker('option', 'monthNames', ['Januar','Februar','Marts','April','Maj','Juni','Juli',' August','September','Oktober','November','December']); <br><br>monthNamesShort : Array : ['Jan', 'Feb', 'Mar', 'Apr', 'May ', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] <br>Set the abbreviation for all months.<br>Initial: $('.selector').datepicker({monthNamesShort:['Jan','Feb','Mar','Apr','Maj','Jun','Jul','Aug' ,'Sep','Okt','Nov','Dec']}); <br>Get: var monthNamesShort = $('.selector').datepicker('option', 'monthNamesShort'); <br> Settings: $('.selector').datepicker('option', 'monthNamesShort', ['Jan','Feb','Mar','Apr','Maj','Jun','Jul',' Aug','Sep','Okt','Nov','Dec']); <br><br>navigationAsDateFormat : Boolean : false <br>If set to true, the formatDate function will be applied to prevText, nextText and Displayed in the value of currentText, for example, displayed as the name of the month. <br>Initial: $('.selector').datepicker({ navigationAsDateFormat: true }); <br>Get: var navigationAsDateFormat = $('.selector').datepicker('option', 'navigationAsDateFormat'); <br>Settings: $('.selector').datepicker('option', 'navigationAsDateFormat', true); <br><br>nextText : String : 'Next' <br>Set the display of the "next month" link Word. <br>Initial: $('.selector').datepicker({ nextText: 'Later' }); <br>Get: var nextText = $('.selector').datepicker('option', 'nextText') ; <br>Settings: $('.selector').datepicker('option', 'nextText', 'Later'); <br><br>numberOfMonths : Number, Array : 1 <br>Set how many to display at a time months. If it is an integer, it is the number of months displayed. If it is an array, it is the number of rows and columns displayed. <br>Initial: $('.selector').datepicker({ numberOfMonths: [2, 3] }); <br>Get: var numberOfMonths = $('.selector').datepicker('option', 'numberOfMonths '); <br>Settings: $('.selector').datepicker('option', 'numberOfMonths', [2, 3]); <br><br>prevText : String : 'Prev' <br>Settings Display text for the "Last Month" link. <br>Initial: $('.selector').datepicker({ prevText: 'Earlier' }); <br>Get: var prevText = $('.selector').datepicker('option', 'prevText') ; <br>Settings: $('.selector').datepicker('option', 'prevText', 'Earlier'); <br><br>shortYearCutoff : String, Number : ' 10' <br>Set the cutoff year value. If it is a number (0-99), it will be counted from the current year. If it is a string, it will be converted into a number and then added to the current year. When the cutoff year is exceeded, it is considered to be the previous century. <br>Initial: $('.selector').datepicker({ shortYearCutoff: 50 }); <br>Get: var shortYearCutoff = $('.selector').datepicker('option', 'shortYearCutoff'); <br>Settings: $('.selector').datepicker('option', 'shortYearCutoff', 50); <br><br>showAnim : String : 'show' <br>Set the animation of showing and hiding the date plug-in name. <br>Initial: $('.selector').datepicker({ showAnim: 'fold' }); <br>Get: var showAnim = $('.selector').datepicker('option', 'showAnim') ; <br>Settings: $('.selector').datepicker('option', 'showAnim', 'fold'); <br><br>showButtonPanel : Boolean : false <br>Settings related to whether to display on the panel button. <br>Initial: $('.selector').datepicker({ showButtonPanel: true }); <br>Get: var showButtonPanel = $('.selector').datepicker('option', 'showButtonPanel'); <br>Settings: $('.selector').datepicker('option', 'showButtonPanel', true); <br><br>showCurrentAtPos : Number : 0 <br>Set the current month when multiple months are displayed Displayed location. Starting at the xth position from the top/left. <br>Initial: $('.selector').datepicker({ showCurrentAtPos: 3 }); <br>Get: var showCurrentAtPos = $('.selector').datepicker('option', 'showCurrentAtPos'); <br>Settings: $('.selector').datepicker('option', 'showCurrentAtPos', 3); <br><br>showMonthAfterYear : Boolean : false <br>Whether to display the month after the year in the header of the panel. <br>Initial: $('.selector').datepicker({ showMonthAfterYear: true }); <br>Get: var showMonthAfterYear = $('.selector').datepicker('option', 'showMonthAfterYear'); <br>Settings: $('.selector').datepicker('option', 'showMonthAfterYear', true); <br><br>showOn : String : 'focus' <br>Set what event triggers the display date plug-in panel , optional values: focus, button, both <br>Initial: $('.selector').datepicker({ showOn: 'both' }); <br>Get: var showOn = $('.selector'). datepicker('option', 'showOn'); <br>Settings: $('.selector').datepicker('option', 'showOn', 'both'); <br><br>showOptions : Options : { } <br>If you use showAnim to display animation effects, you can use this parameter to add some additional parameter settings. <br>Initial: $('.selector').datepicker({ showOptions: {direction: 'up' }); <br>Get: var showOptions = $('.selector').datepicker('option', ' showOptions'); <br>Settings: $('.selector').datepicker('option', 'showOptions', {direction: 'up'); <br><br>showOtherMonths : Boolean : false <br>Yes Display some date numbers for the previous and next two months in the current panel (not selectable). <br>Initial: $('.selector').datepicker({ showOtherMonths: true }); <br>Get: var showOtherMonths = $('.selector').datepicker('option', 'showOtherMonths'); <br>Settings: $('.selector').datepicker('option', 'showOtherMonths', true); <br><br>stepMonths : Number : 1 <br>When clicking on the previous/next month, it will scroll once months.<br>Initial: $('.selector').datepicker({ stepMonths: 3 }); <br>Get: var stepMonths = $('.selector').datepicker('option', 'stepMonths'); <br>Settings: $('.selector').datepicker('option', 'stepMonths', 3); <br><br>yearRange : String : '-10: 10' <br>Control the year in the drop-down list The number of years displayed can be relative to the current year (-nn: nn) or absolute (-nnnn: nnnn) <br>Initial: $('.selector').datepicker({ yearRange: '2000:2010 ' }); <br>Get: var yearRange = $('.selector').datepicker('option', 'yearRange'); <br>Set: $('.selector').datepicker('option', 'yearRange', '2000:2010'); <br> </div> <br>Event<br><div class="codetitle"> <span><a style="CURSOR: pointer" data="17830" class="copybut" id="copybut17830" onclick="doCopy('code17830')"><u>Copy code</u></a></span> The code is as follows: </div> <div class="codebody" id="code17830"> <br>beforeShow : function(input) <br>Trigger this event before the date control displays the panel, and return the instance object of the control that currently triggers the event. <br>Initial: $('.selector').datepicker({ beforeShow: function(input) { ... } }); <br><br>beforeShowDay : function(date) <br>Display panel in date control Previously, this event was triggered when the date on each panel was bound, and the parameter was the date that triggered the event. After calling the function, an array must be returned: [0] Whether this date is optional (true/false), [1] The CSS style name of this date ("" means default), [2] When the mouse is moved above, a prompt will appear content. <br>Initial: $('.selector').datepicker({ beforeShowDay: function(date) { ... } }); <br><br>onChangeMonthYear : function(year, month, inst) <br>The current year This event is triggered when the month or month changes, and the parameters are the changed year and month and the instance of the current date plug-in. <br>Initial: $('.selector').datepicker({ onChangeMonthYear: function(year, month, inst) { ... } }); <br><br>onClose : function(dateText, inst) <br>This event is triggered when the date panel is closed (regardless of whether a date is selected), and the parameters are the selected date and the instance of the current date plug-in. <br>Initial: $('.selector').datepicker({ onClose: function(dateText, inst) { ... } }); <br><br>onSelect : function(dateText, inst) <br>When This event is triggered after a date is selected in the date panel. The parameters are the selected date and the instance of the current date plug-in. <br>$('.selector').datepicker({ onSelect: function(dateText, inst) { ... } }); <br> </div> <br>Method: <br><div class="codetitle"> <span> <a style="CURSOR: pointer" data="37720" class="copybut" id="copybut37720" onclick="doCopy('code37720')"><u>Copy code</u></a></span> The code is as follows: </div> <div class="codebody" id="code37720"> <br>destroy <br>Remove drag functionality from the element. <br>Usage: .datepicker( 'destroy' ) <br><br>disable <br>Disable the dragging function of the element. <br>Usage: .datepicker( 'disable' ) <br><br>enable <br>Enable the dragging function of the element. <br>Usage: .datepicker( 'enable' ) <br><br>option <br>Gets or sets the parameters of the element. <br>Usage: .datepicker( 'option' , optionName , [value] ) <br><br>dialog <br>Open a date plug-in in the dialog plug-in. <br>Usage: .datepicker( 'dialog' , dateText , [onSelect] , [settings] , [pos] ) <br><br>isDisabled <br>Confirm whether the date plugin has been disabled. <br>Usage: .datepicker( 'isDisabled' ) <br><br>hide <br>Hide (close) the previously opened date panel. <br>Usage: .datepicker( 'hide' , [speed] ) <br><br>show <br>.datepicker( 'show' ) <br>Show date plugin. <br>Usage: .datepicker( 'show' ) <br><br>getDate <br>Returns the date selected by the current date plugin. <br>Usage: .datepicker( 'getDate' ) <br><br>setDate <br>Set the current date of the date plug-in. The date parameter can be a number (counting from today, e.g. 7), or a valid string ('y' for year, 'm' for month, 'w' for week, 'd' for day, for example: ' 1m 7d '), null means the current day. <br>Usage: .datepicker( 'setDate' , date ) <br> </div> <br><br><br><strong>Usage explanation of jquery-ui-datepicker<br></strong>1: First When importing relevant js into the page, please note that the order of introduction cannot be wrong <br><br>jquery-1.4.2.min.js <br>jquery-ui.min.js <br>jquery.ui.datepicker.min.js <br>jquery.ui.datepicker-zh-CN.min.js <br>jquery.ui.datepicker-fr.min.js <br>....etc. language packs (add which ones you use) <br>Note :The last sentence of the language pack sets the default Localization of the datepicker <br>Similar to this sentence: setDefaults(....regional[...]) <br>So if the datepicker of the page is no longer set by itself, By default, the Localization of the last introduced language package will prevail. <br><br>2: Page example <br><br>The comments are very clear. The official document of datepicker requires init to set the option first. datepicker, then setter or getter <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="4608" class="copybut" id="copybut4608" onclick="doCopy('code4608')"><u>Copy code </u></a></span> The code is as follows: </div> <div class="codebody" id="code4608"> <br><html> <br><head> <br><script type="text/javascript"> <br>$(function() { <br>//$("# datepicker").datepicker(...);//Represents the direct execution of creating datepicker() with the... attribute <br>//You must first init datepicker before setting the datepicker option <br>//$("# datepicker").datepicker('option',...,...); //Represents setting the attribute value of datepicker..., but does not create datepicker(); <br>//$ .datepicker.setDefaults($.datepicker.regional['zh-CN']); <br>$.datepicker.setDefaults($.datepicker.regional['']);//First clean up the regional of the language pack <br>$("#datepicker").datepicker(); <br>$("#datepicker").datepicker('option', $.datepicker.regional['zh-CN']); <br>//$ ("#datepicker").datepicker($.datepicker.regional['zh-CN']);//The execution of this sentence fails because there is $("#datepicker").datepicker(); before <br>$ ("#datepicker").datepicker('option', 'dateFormat','yy-mm-dd');//set dateFormat <br>//var dateFormat = $( "#datepicker" ).datepicker( "option ", "dateFormat" );//get dateFormat <br>//$("#datepicker").datepicker('option', {dateFormat: 'yy-mm-dd'});//set dateFormat <br> }); <br></script>






Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template