jQuery日期格式

Dot*_*row 178 jquery

如何使用jQuery格式化日期.我使用下面的代码,但收到错误:

 $("#txtDate").val($.format.date(new Date(), 'dd M yy'));
Run Code Online (Sandbox Code Playgroud)

请提出解决方案.

Thu*_*ram 207

在你的页面中添加jquery ui插件.

 $("#txtDate").val($.datepicker.formatDate('dd M yy', new Date()));
Run Code Online (Sandbox Code Playgroud)

  • 非常好,特别是当你已经拥有jQuery UI时 (14认同)
  • 这是官方文档的链接:http://api.jqueryui.com/datepicker/#utility-formatDate (4认同)
  • 这是我一直在寻找的答案,特别是因为我在其他地方使用jQuery UI. (2认同)
  • 优秀的解决方 (2认同)

Pas*_*cal 97

另一种方法是简单的js date()函数,如果你不想使用jQuery/jQuery插件:

例如:

var formattedDate = new Date("yourUnformattedOriginalDate");
var d = formattedDate.getDate();
var m =  formattedDate.getMonth();
m += 1;  // JavaScript months are 0-11
var y = formattedDate.getFullYear();

$("#txtDate").val(d + "." + m + "." + y);
Run Code Online (Sandbox Code Playgroud)

请参阅:使用JavaScript格式化时间和日期的10种方法

如果要将前导零添加到日/月,这是一个完美的示例: Javascript添加前导零到目前为止

如果你想用前导零添加时间,试试这个: getMinutes()0-9 - 如何使用两个数字?


Pek*_*ica 95

jQuery dateFormat是一个单独的插件.您需要使用<script>标记显式加载.

  • @Dotnet如果可以使用jQuery完成,那么就不会有用于日期格式化的jQuery插件,是吗? (31认同)
  • 我可以在不使用该插件的情况下格式化日期吗? (10认同)
  • @Dotnet肯定,使用其他功能:参见[here](http://www.webdevelopersnotes.com/tips/html/10_ways_to_format_time_and_date_using_javascript.php3) (9认同)
  • 很难相信香草jQuery没有格式化日期的功能。这个问题有5岁了,是这样吗? (2认同)

Owe*_*wen 30

这是我刚刚制作的一个非常基本的功能,它不需要任何外部插件:

$.date = function(dateObject) {
    var d = new Date(dateObject);
    var day = d.getDate();
    var month = d.getMonth() + 1;
    var year = d.getFullYear();
    if (day < 10) {
        day = "0" + day;
    }
    if (month < 10) {
        month = "0" + month;
    }
    var date = day + "/" + month + "/" + year;

    return date;
};
Run Code Online (Sandbox Code Playgroud)

使用:

$.date(yourDateObject);
Run Code Online (Sandbox Code Playgroud)

结果:

dd/mm/yyyy
Run Code Online (Sandbox Code Playgroud)


Dom*_*Ras 24

ThulasiRam,我更喜欢你的建议.在稍微不同的语法/上下文中它对我很有用:

var dt_to = $.datepicker.formatDate('yy-mm-dd', new Date());
Run Code Online (Sandbox Code Playgroud)

如果您决定使用JQuery UI中的 datepicker ,请确保在文档的<head>部分中使用正确的引用:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />

<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> 
Run Code Online (Sandbox Code Playgroud)


小智 21

我正在使用Moment JS.非常有用且易于使用.

var date = moment(); //Get the current date
date.format("YYYY-MM-DD"); //2014-07-10
Run Code Online (Sandbox Code Playgroud)


小智 13

我希望这段代码能解决您的问题.

var d = new Date();

var curr_day = d.getDate();
var curr_month = d.getMonth();
var curr_year = d.getFullYear();

var curr_hour = d.getHours();
var curr_min = d.getMinutes();
var curr_sec = d.getSeconds();

curr_month++ ; // In js, first month is 0, not 1
year_2d = curr_year.toString().substring(2, 4)

$("#txtDate").val(curr_day + " " + curr_month + " " + year_2d)
Run Code Online (Sandbox Code Playgroud)


小智 8

如果您使用的是 jquery ui 那么您可以像下面这样使用它,您可以指定自己的日期格式

$.datepicker.formatDate( "D dd-M-yy", new Date()) // Output "Fri 08-Sep-2017"
Run Code Online (Sandbox Code Playgroud)


小智 6

只要用这个:

var date_str=('0'+date.getDate()).substr(-2,2)+' '+('0'+date.getMonth()).substr(-2,2)+' '+('0'+date.getFullYear()).substr(-2,2);
Run Code Online (Sandbox Code Playgroud)


Sco*_*lak 5

虽然几年前就提出了这个问题,但是如果有问题的日期值是带格式的字符串mm/dd/yyyy(比如使用日期选择器时),则不再需要jQuery插件;

var birthdateVal = $('#birthdate').val();
//birthdateVal: 11/8/2014

var birthdate = new Date(birthdateVal);
//birthdate: Sat Nov 08 2014 00:00:00 GMT-0500 (Eastern Standard Time)
Run Code Online (Sandbox Code Playgroud)


Baj*_*jju 5

你可以利用这个片段

$('.datepicker').datepicker({
  changeMonth: true,
  changeYear: true,
  yearRange: '1900:+0',
  defaultDate: '01 JAN 1900',
  buttonImage: "http://www.theplazaclub.com/club/images/calendar/outlook_calendar.gif",
  dateFormat: 'dd/mm/yy',
  onSelect: function() {
    $('#datepicker').val($(this).datepicker({
      dateFormat: 'dd/mm/yy'
    }).val());
  }
});
Run Code Online (Sandbox Code Playgroud)
<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>

<p>
  selector: <input type="text" class="datepicker">
</p>
<p>
  output: <input type="text" id="datepicker">
</p>
Run Code Online (Sandbox Code Playgroud)


BIB*_*NJU 5

我们可以简单地格式化日期,例如:

var month = date.getMonth() + 1;
var day = date.getDate();
var date1 = (('' + day).length < 2 ? '0' : '') + day + '/' + (('' + month).length < 2 ? '0' : '') + month + '/' + date.getFullYear();
$("#txtDate").val($.datepicker.formatDate('dd/mm/yy', new Date(date1)));
Run Code Online (Sandbox Code Playgroud)

其中“日期”是任何格式的日期。


use*_*968 5

您可以添加新用户 jQuery 函数“getDate”

JSFiddle:getDate jQuery

或者您可以运行代码片段。只需按此帖子下方的“运行代码片段”按钮即可。

// Create user jQuery function 'getDate'
(function( $ ){
   $.fn.getDate = function(format) {

	var gDate		= new Date();
	var mDate		= {
	'S': gDate.getSeconds(),
	'M': gDate.getMinutes(),
	'H': gDate.getHours(),
	'd': gDate.getDate(),
	'm': gDate.getMonth() + 1,
	'y': gDate.getFullYear(),
	}

	// Apply format and add leading zeroes
	return format.replace(/([SMHdmy])/g, function(key){return (mDate[key] < 10 ? '0' : '') + mDate[key];});

	return getDate(str);
   }; 
})( jQuery );


// Usage: example #1. Write to '#date' div
$('#date').html($().getDate("y-m-d H:M:S"));

// Usage: ex2. Simple clock. Write to '#clock' div
function clock(){
	$('#clock').html($().getDate("H:M:S, m/d/y"))
}
clock();
setInterval(clock, 1000); // One second

// Usage: ex3. Simple clock 2. Write to '#clock2' div
function clock2(){

	var format = 'H:M:S'; // Date format
	var updateInterval = 1000; // 1 second
	var clock2Div	= $('#clock2'); // Get div
	var currentTime	= $().getDate(format); // Get time
	
	clock2Div.html(currentTime); // Write to div
	setTimeout(clock2, updateInterval); // Set timer 1 second
	
}
// Run clock2
clock2();

// Just for fun
// Usage: ex4. Simple clock 3. Write to '#clock3' span

function clock3(){

	var formatHM = 'H:M:'; // Hours, minutes
	var formatS = 'S'; // Seconds
	var updateInterval = 1000; // 1 second
	var clock3SpanHM	= $('#clock3HM'); // Get span HM
	var clock3SpanS	= $('#clock3S'); // Get span S
	var currentHM	= $().getDate(formatHM); // Get time H:M
	var currentS	= $().getDate(formatS); // Get seconds
	
	clock3SpanHM.html(currentHM); // Write to div
	clock3SpanS.fadeOut(1000).html(currentS).fadeIn(1); // Write to span
	setTimeout(clock3, updateInterval); // Set timer 1 second
	
}
// Run clock2
clock3();
Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

<div id="date"></div><br>
<div id="clock"></div><br>
<span id="clock3HM"></span><span id="clock3S"></span>
Run Code Online (Sandbox Code Playgroud)

享受!


小智 5

将此功能添加到您的<script></script>电话中并从中随意拨打电话<script></script>

<script>

function GetNow(){
    var currentdate = new Date(); 
    var datetime = currentdate.getDate() + "-"
            + (currentdate.getMonth()+1)  + "-" 
            + currentdate.getFullYear() + " "  
            + currentdate.getHours() + ":"  
            + currentdate.getMinutes() + ":" 
            + currentdate.getSeconds();
    return datetime;
}

window.alert(GetNow());

</script>
Run Code Online (Sandbox Code Playgroud)

或者您可以简单地使用提供格式化设施的Jquery: -

window.alert(Date.parse(new Date()).toString('yyyy-MM-dd H:i:s'));
Run Code Online (Sandbox Code Playgroud)

我喜欢第二种选择.它一次解决所有问题.

  • 第二个选项给了我“Number.toString 的基数参数必须在 2 到 36 之间”。它崩溃了。 (3认同)