1、Ext.form.field.Time主要配置
Ext.form.field.Time主要配置項目表
| 配置項 | 類型 | 說明 |
|---|---|---|
| altFormat | String | 多個時間輸入格式組成的字符串，不同的格式之間使用"|"分隔。將使用這些格式來解析用戶的輸入信息。默認值為"g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|h a|g a|g A|gi|hi|gia|hia|g|H|gi a|hia|giA|hiA|gi A|hi A" |
| format | String | 顯示格式，默認為"g:i A" |
| increment | Number | 在時間列表中兩個相鄰選項的時間間隔，默認為15分鍾。 |
| invalidText | String | 輸入值無效時的提示消息，默認為"{value} is not a valid time" |
| maxValue | Date/String | 列表中允許的最大時間 |
| maxText | String | 當時間大於最大值時的提示信息 |
| minValue | Date/String | 列表中允許的最小時間 |
| minText | String | 當時間小於最小值時的提示信息 |
| pickerMaxHeight | Number | 時間拾取器的最大高度，默認為300px |
| submitFormat | String | 設置提交到服務器的日期格式，默認為format |
時間顯示格式說明
| 標識 | 說明 | 示例 |
|---|---|---|
| g | 小時，12時計時法，不帶前綴0 | 1至12 |
| G | 小時，24時計時法，不帶前綴0 | 1至23 |
| h | 小時，12時計時法，帶前綴0 | 01至12 |
| H | 小時，24時計時法，帶前綴0 | 01至23 |
| i | 分鍾，帶前綴0 | 00至59 |
| s | 秒，帶前綴0 | 00至59 |
| a | 午前與午后縮寫，小寫表示 | am(午前) pm(午后) |
| A | 午前與午后縮寫，小寫表示 | AM(午前) PM(午后) |
| u | 毫秒，帶前綴0 | 001至999 |
| O | 所在時區與格林威治時間在小時和分鍾上的差異 | +1030 |
| P | 所在時區與格林威治時間在小時和分鍾上的差異，在小時和分鍾之間插入“：” | -8:30 |
| T | 所在時區縮寫 | EST等 |
| Z | 所在時區與格林威治時間在時間上的差距，以s為單位 |
2、Ext.form.field.Time示例
代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Ext.form.field.Time示例</title> <link href="ext-4.0.7-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" /> <script src="ext-4.0.7-gpl/bootstrap.js" type="text/javascript"></script> <script type="text/javascript"> Ext.onReady(function () { var frm = new Ext.form.Panel({ title: "Ext.form.field.Time示例", bodyStyle: "padding:5", frame: true, height: 100, width: 240, renderTo: Ext.getBody(), items: [{ fieldLabel: "時間選擇框", labelWidth: 80, width: 200, xtype: "timefield", labelSeparator: "：", labelAlign: "left", msgTarget: "side", autoFitErrors: false, maxValue: "18:00", maxText: "時間應小於{0}", minValue: "10:00", minText: "時間應大於{0}", pickerMaxHeight: 100, increment: 60, format: "G時i分s秒", invalidText: "時間格式無效" }] }); }); </script> </head> <body> </body> </html>
效果圖：
