1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
|
---
title: timepicker
slug: Archive/Mozilla/XUL/timepicker
tags:
- XUL Elements
- XUL Reference
translation_of: Archive/Mozilla/XUL/timepicker
---
<div class="noinclude"><span class="breadcrumbs XULRef_breadcrumbs">
« <a href="/ja/docs/XUL/XUL_Reference">XUL リファレンス HOME</a> [
<a href="#Examples">例</a> |
<a href="#Attributes">属性</a> |
<a href="#Properties">プロパティ</a> |
<a href="#Methods">メソッド</a> |
<a href="#Related">関連項目</a> ]
</span></div>
<div></div>
<p>timepicker は時間の入力に使われます。時、分、秒の 3 つのフィールドを持っています。フィールドの隣の矢印ボタンはマウスによる値の調整を可能にしています。4 つ目のテキストボックスは 12 時間表記で午前か午後かを選べるように出現します。</p>
<p>初期値を指定するには、<code>value</code> 属性に <var>HH:MM:SS</var> あるいは <var>HH:MM</var> のどちらかの値を設定します。<code>value</code> プロパティか <code>dateValue</code> プロパティを使用して値を取得したり変更できます。前者は時間を <var>HH:MM:SS</var> 形式の文字列として指定し、一方後者は時間を <a href="/ja/docs/JavaScript/Reference/Global_Objects/Date" title="JavaScript/Reference/Global_Objects/Date">Date</a> オブジェクトとして指定します。さらに、<code>hour</code>, <code>minute</code>, <code>second</code> プロパティで時間の各要素の取得と変更ができます。</p>
<p>時間が変更されるたびに change イベントが発生します。However, as described in <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=799219" title="https://bugzilla.mozilla.org/show_bug.cgi?id=799219">Mozilla bug #799219</a>, a change event handler may encounter erratic behavior when the time is changed using the keyboard instead of the mouse. To avoid this, you can use the workaround described <a href="https://groups.google.com/d/topic/mozilla.dev.tech.xul/lOvK6bAwVoI/discussion" title="/en-US/docs/XUL/Attribute/where.subject">here</a>, i.e., use <code>window.setTimeout(<em>actual-event-handler-function</em>, 0);</code> to queue up your event handler to run after the rest of the picker's change event handlers.</p>
<dl>
<dt>属性</dt>
<dd><a href="#a-disabled">disabled</a>, <a href="#a-hideseconds">hideseconds</a>, <a href="#a-timepicker.increment">increment</a>, <a href="#a-readonly">readonly</a>, <a href="#a-tabindex">tabindex</a>, <a href="#a-timepicker.value">value</a></dd>
</dl>
<dl>
<dt>プロパティ</dt>
<dd><a href="#p-amIndicator">amIndicator</a>, <a href="#p-dateValue">dateValue</a>, <a href="#p-disabled">disabled</a>, <a href="#p-hideSeconds">hideSeconds</a>, <a href="#p-hour">hour</a>, <a href="#p-hourLeadingZero">hourLeadingZero</a>, <a href="#p-increment">increment</a>, <a href="#p-is24HourClock">is24HourClock</a>, <a href="#p-isPM">isPM</a>, <a href="#p-minute">minute</a>, <a href="#p-minuteLeadingZero">minuteLeadingZero</a>, <a href="#p-pmIndicator">pmIndicator</a>, <a href="#p-readOnly">readOnly</a>, <a href="#p-second">second</a>, <a href="#p-secondLeadingZero">secondLeadingZero</a>, <a href="#p-tabIndex">tabIndex</a>, <a href="#p-timepicker.value">value</a></dd>
</dl>
<h3 id="Examples" name="Examples">Examples</h3>
<pre class="brush:xml;gutter:false;"><timepicker value="12:05"/></pre>
<p><img alt="Image:Controlguide-timepicker.png" class="internal" src="/@api/deki/files/142/=Controlguide-timepicker.png"></p>
<h3 id="Attributes" name="Attributes">属性</h3>
<p> </p><div id="a-disabled">
<dl>
<dt>
<code id="a-disabled"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/disabled">disabled</a></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
要素が無効化されているかどうかを示します。ある要素が <code>true</code> に設定されていたら、その要素は無効化されています。無効化された要素は通常グレイ表示のテキストで描画されます。要素が無効化されていると、ユーザのアクションには応答せず、フォーカスもあてられず、<code>command</code> イベントも発生しません。
</dd>
</dl>
<p> </p>
</div> <div id="a-hideseconds">
<dl>
<dt>
<code id="a-hideseconds"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/hideseconds">hideseconds</a></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
秒フィールドを表示するかどうかを示します。</dd>
</dl>
</div> <div id="a-readonly">
<dl> <dt><code id="a-readonly"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/readonly">readonly</a></code></dt> <dd>型: <em>論理型</em></dd> <dd><code>true</code> に設定した場合、ユーザは要素の値を変更できません。しかし、スクリプトからは依然として値を変更できます。</dd> <div class="geckoVersionNote"><div class="geckoVersionHeading">
Gecko 2 note
<div style="font-size: 9px; line-height: 1; font-style: italic;">(Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)</div>
</div> Gecko 2.0 まで、<code>readonly</code> 属性は XBL フィールド上で正しく動作しませんでした。</div>
</dl>
</div> <div id="a-timepicker.increment">
<dl>
<dt>
<code id="a-timepicker.increment"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/timepicker.increment">increment</a></code></dt>
<dd>
型: <em>整数型</em></dd>
<dd>
矢印が押されたときに変更される分の値。これを使用するときは <code id="a-hideseconds"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/hideseconds">hideseconds</a></code> が <code>true</code> に設定されている必要があります。</dd>
</dl>
</div> <div id="a-tabindex">
<dl><dt> <code id="a-tabindex"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/tabindex">tabindex</a></code> </dt><dd> 型: <em>整数型</em> </dd><dd> 要素のタブの順番。タブの順番は <code>tab</code> キーが押下されたときにフォーカスが移動する順番です。より大きな <code>tabindex</code> の値をもつ要素は、タブの遷移が後になります。 </dd></dl>
</div> <div id="a-timepicker.value">
<dl>
<dt>
<code id="a-timepicker.value"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/timepicker.value">value</a></code></dt>
<dd>
型: <em>文字列型</em></dd>
<dd>
timepicker の初期値を <var>HH:MM:SS</var> 形式と <var>HH:MM</var> 形式のどちらかに設定します。</dd>
</dl>
</div>
<h3 id="Properties" name="Properties">プロパティ</h3>
<p> </p><div id="p-amIndicator">
<dl><dt> <code><span><a href="http://api/ja/docs/XUL/Property/amIndicator">amIndicator</a></span></code> </dt><dd> 型: <em>文字列型</em> </dd><dd> 設定された文字列は、午前と午後の区別表示に使用されます。初期値は <code>AM</code> です。この値はユーザが使用するロケールに合わせる事もできます。 </dd></dl>
</div> <div id="p-dateValue">
<dl>
<dt>
<code><span><a href="http://api/ja/docs/XUL/Property/dateValue">dateValue</a></span></code></dt>
<dd>
型: <em>Date</em></dd>
<dd>
<a href="/ja/docs/JavaScript/Reference/Global_Objects/Date" title="JavaScript/Reference/Global_Objects/Date">Date</a> オブジェクトとして datepicker に現在入力または選択されている日付</dd>
</dl></div> <div id="p-disabled">
<dl><dt> <code><span><a href="http://api/ja/docs/XUL/Property/disabled">disabled</a></span></code> </dt><dd> 型: <em>論理型</em> </dd><dd> <code id="a-disabled"><a href="http://api/ja/docs/Mozilla/Tech/XUL/Attribute/disabled">disabled</a></code> 属性の値の取得と設定。 </dd></dl>
</div> <div id="p-hideSeconds">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/hideSeconds">hideSeconds</a></span></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
秒フィールドが表示されているかどうかを示します。</dd>
</dl></div> <div id="p-hour">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/hour">hour</a></span></code></dt>
<dd>
型: <em>整数型</em></dd>
<dd>
現在選択されている 0 から 23 までの時刻。選択された時刻を変更するには、このプロパティを設定します。</dd>
</dl></div> <div id="p-hourLeadingZero">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/hourLeadingZero">hourLeadingZero</a></span></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
hour が 10 未満の場合、先頭にゼロを表示するかどうか指示します。このプロパティは読み取り専用です。</dd>
</dl></div> <div id="p-increment">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/increment">increment</a></span></code></dt>
<dd>
型: <em>整数型</em></dd>
<dd>
<code id="a-increment"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/increment">increment</a></code> 属性の値の取得と設定。</dd>
</dl></div> <div id="p-is24HourClock">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/is24HourClock">is24HourClock</a></span></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
時刻の表示に 24 時間形式と 12 時間形式のどちらを使用しているかを示します。12 時間形式の時計では、ユーザが AM と PM を拡張フィールドで取得することができます。このプロパティは読み込み専用です。この値はユーザのロケールから判定されます。</dd>
</dl></div> <div id="p-isPM">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/isPM">isPM</a></span></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
<code>false</code> の場合、hour は 0 から 11 の間になります。<code>true</code> の場合、hour は 12 以上になります。</dd>
</dl></div> <div id="p-minute">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/minute">minute</a></span></code></dt>
<dd>
型: <em>整数型</em></dd>
<dd>
現在選択されている、0 から 59 までの分。選択された分を変更するには、このプロパティを設定します。</dd>
</dl></div> <div id="p-minuteLeadingZero">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/minuteLeadingZero">minuteLeadingZero</a></span></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
分の値が 10 未満の場合、先頭にゼロを表示するかどうかを指示します。このプロパティは読み取り専用です。</dd>
</dl></div> <div id="p-pmIndicator">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/pmIndicator">pmIndicator</a></span></code></dt>
<dd>
型: <em>文字列型</em></dd>
<dd>
設定された文字列は午前と午後の区別表示に使用されます。初期値は PM です。この値はユーザが使用するロケールに合わせる事もできます。</dd>
</dl></div> <div id="p-readOnly">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/readOnly">readOnly</a></span></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
<code>true</code> に設定すると、ユーザは要素の値を変更できなくなります。</dd>
</dl></div> <div id="p-second">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/second">second</a></span></code></dt>
<dd>
型: <em>整数型</em></dd>
<dd>
現在選択されている 0 から 59 までの秒。選択された秒を変更するには、このプロパティを設定します。</dd>
</dl></div> <div id="p-secondLeadingZero">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/secondLeadingZero">secondLeadingZero</a></span></code></dt>
<dd>
型: <em>論理型</em></dd>
<dd>
秒の値が 10 未満の場合、先頭にゼロを表示するかどうかを指示します。このプロパティは読み取り専用です。</dd>
</dl></div> <div id="p-tabIndex">
<dl><dt> <code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/tabIndex">tabIndex</a></span></code> </dt><dd> 型: <em>整数型</em> </dd><dd> <code id="a-tabindex"><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Attribute/tabindex">tabindex</a></code> 属性の値の取得と設定。 </dd></dl>
</div> <div id="p-timepicker.value">
<dl>
<dt>
<code><span><a href="https://developer.mozilla.org/ja/docs/XUL/Property/timepicker.value">value</a></span></code></dt>
<dd>
型: <em>文字列型</em></dd>
<dd>
現在入力されている <var>HH:MM:SS</var> 形式の時間。時間を変更するには、このプロパティを設定します。</dd>
</dl></div>
<h3 id="Methods" name="Methods">メソッド</h3>
<div style="border: 1px solid rgb(204, 204, 204); margin: 0px 0px 10px 10px; padding: 0px 10px; background: rgb(238, 238, 238) none repeat scroll 0% 50%;">
<p><strong>XUL 要素からの継承</strong><br>
<small> <span id="m-blur"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/blur">blur</a></code></span>, <span id="m-click"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/click">click</a></code></span>, <span id="m-doCommand"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/doCommand">doCommand</a></code></span>, <span id="m-focus"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/focus">focus</a></code></span>, <span id="m-getElementsByAttribute"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/getElementsByAttribute">getElementsByAttribute</a></code></span>, <span id="m-getElementsByAttributeNS"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/getElementsByAttributeNS">getElementsByAttributeNS</a></code></span> </small></p>
<p><strong>DOM 要素からの継承</strong><br>
<small> <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.addEventListener">addEventListener()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.appendChild">appendChild()</a></code>, <a class="internal" href="/ja/DOM/Node.compareDocumentPosition" title="ja/DOM/Node.compareDocumentPosition">compareDocumentPosition</a>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.dispatchEvent">dispatchEvent()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.getAttribute">getAttribute()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.getAttributeNode">getAttributeNode()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.getAttributeNodeNS">getAttributeNodeNS()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.getAttributeNS">getAttributeNS()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.getElementsByTagName">getElementsByTagName()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.getElementsByTagNameNS">getElementsByTagNameNS()</a></code>, <a class="internal" href="/ja/DOM/Node.getFeature" title="ja/DOM/Node.getFeature">getFeature</a>, <a class="internal" href="/ja/DOM/Node.getUserData" title="ja/DOM/Node.getUserData">getUserData</a>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.hasAttribute">hasAttribute()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.hasAttributeNS">hasAttributeNS()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.hasAttributes">hasAttributes()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.hasChildNodes">hasChildNodes()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.insertBefore">insertBefore()</a></code>, <a class="internal" href="/ja/DOM/Node.isEqualNode" title="ja/DOM/Node.isEqualNode">isEqualNode</a>, <a class="internal" href="/ja/DOM/Node.isSameNode" title="ja/DOM/Node.isSameNode">isSameNode</a>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.isSupported">isSupported()</a></code>, <a class="internal" href="/ja/DOM/Node.lookupNamespaceURI" title="ja/DOM/Node.lookupNamespaceURI">lookupNamespaceURI</a>, <a class="internal" href="/ja/DOM/Node.lookupPrefix" title="ja/DOM/Node.lookupPrefix">lookupPrefix</a>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.normalize">normalize()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.removeAttribute">removeAttribute()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.removeAttributeNode">removeAttributeNode()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.removeAttributeNS">removeAttributeNS()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.removeChild">removeChild()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.removeEventListener">removeEventListener()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.replaceChild">replaceChild()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.setAttribute">setAttribute()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.setAttributeNode">setAttributeNode()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.setAttributeNodeNS">setAttributeNodeNS()</a></code>, <code><a href="https://developer.mozilla.org/ja/docs/DOM/element.setAttributeNS">setAttributeNS()</a></code>, <a class="internal" href="/ja/DOM/Node.setUserData" title="ja/DOM/Node.setUserData">setUserData</a></small></p>
</div>
<h3 id="Related" name="Related">関連項目</h3>
<dl>
<dt>インタフェース</dt>
<dd><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDOMXULControlElement" title="">nsIDOMXULControlElement</a></code></dd>
</dl>
|
