jquery如何將日期轉換成字串

在前端開發中，日期處理是一個常見問題。在使用 jQuery 開發時，日期轉換成字串也是常見的需求。本文將透過介紹 jQuery 的 datepicker 插件，來示範如何將日期轉換成字串。

一、jQuery datepicker

jQuery datepicker 是一個日期選擇器插件，它使用了 jQuery UI 的樣式，並提供了日期選擇的互動功能。使用 jQuery datepicker 插件，可以方便地選擇日期，並將其格式化成字串。

1. 安裝 jQuery datepicker

首先，需要在 HTML 頁面中引入 jQuery 和 jQuery UI 的庫文件，以及 jQuery datepicker 的庫文件。可以從 jQuery 的官網（https://jquery.com/）和 jQuery UI 的官網（https://jqueryui.com/）下載對應的庫檔案。或使用 CDN 載入。

2. #使用jQuery datepicker

使用jQuery datepicker 只需要為日期輸入框新增一個class ，然後在JavaScript 中呼叫datepicker 函數即可。

HTML 程式碼：

JavaScript 程式碼：

##$(document). ready(function(){

$(".datepicker").datepicker();

});

這樣就可以在日期輸入框上點擊，彈出日期選擇器了。

二、日期轉換成字串

將日期轉換成字串，主要涉及兩個過程：取得日期和格式化成字串。

取得日期

使用 jQuery datepicker，可以透過函數取得日期。例如，取得日期選擇器彈出時預設的日期：

$(".datepicker").datepicker("getDate")

這個函數傳回一個 JavaScript 的 Date 類型的物件。

格式化成字串

使用 JavaScript 的 Date 類型自帶了一些日期格式化的方法，包括 toDateString()、toLocaleDateString() 等等。但這些方法的缺點是無法自訂格式。

為了方便地格式化日期，我們可以使用第三方函式庫 moment.js（https://momentjs.com/），它提供了非常方便的日期處理方法。

例如，我們想把日期格式化成 yyyy-mm-dd 的形式，可以使用 moment.js 的 format() 方法。

moment(date).format("YYYY-MM-DD")

#其中，date 是 JavaScript 的 Date 類型的對象，表示要格式化的日期。 format() 方法的參數是一個字串，用來指定輸出的格式。 YYYY 表示四位數的年份，MM 表示月份，DD 表示天數。

完整的程式碼如下：

HTML 程式碼：

轉換

JavaScript 程式碼：

#$(document).ready( function(){

$(".datepicker").datepicker();
$("#btnConvert").click(function(){
    var date = $(".datepicker").datepicker("getDate");
    var dateString = moment(date).format("YYYY-MM-DD");
    $("#result").text(dateString);
});

});

#首先，為日期輸入框新增了datepicker 類別。然後，定義了一個按鈕來觸發日期轉換的過程。當點擊按鈕時，getUserDate() 函數會取得日期，並使用 moment.js 來格式化日期成字串。

三、總結

使用 jQuery datepicker 插件，可以快速實作日期選擇器。而使用 moment.js，可以方便地將日期轉換成字串，並自訂日期的格式。透過本文的講解，相信大家對於 jQuery 如何將日期轉換成字串有了更深刻的理解。

以上是jquery如何將日期轉換成字串的詳細內容。更多資訊請關注PHP中文網其他相關文章！