私はユーザーから年間を収集するために必要なフィールドを持っています（つまり、年間の解像度を持つ日付 - 実際の日付の値を格納することをお勧めします）。HTML入力タイプ「日付」を使用して1年のみを収集できますか？
近代的なブラウザでサポートされている日付入力UI、またはwebshimsを使用したいと思います。私は年だけを表示するUIを取得する方法を理解できませんでした。何か案は？
プラットフォームサポートがない場合は、「プレビュー」をクリックしてウィジェットの上部を数回クリックすると、逆の場合を除いて、see hereのようなUIを持つことが理想的です。入力をクリックすると、何十年ものリストを持つウィジェットが得られます。その後、ドリルダウンして年を選択すると、UIが閉じます。
いいえ、あなたはそれだけでは年をサポートしていないので、jQueryやWebshimリンクのようなスクリプトが必要です。これには年のみが表示されます。
jQueryのはオプションになります場合は、ここSibuから借りて、いずれかになります。
$(function() {
$("#datepicker").datepicker({dateFormat: 'yy'});
});
CSS
.ui-datepicker-calendar {
display: none;
}
のSrc：https://stackoverflow.com/a/13528855/2827823
のSrcフィドル：ここhttp://jsfiddle.net/vW8zc/
はなくて、an updated fiddleです月、前/次ボタン
ブートストラップがオプションの場合は、check this linkのレイアウトがあります。
結果のインターフェースを見ると、恐ろしいことです（とにかく1年のピッカー）。あなたが行うことができる唯一のアクションは、月間でページを作成することです。最終的に特定の年になりますが、ユーザーに誕生年が何であるかを尋ねると、思ったよりも12倍多くクリックされます。 Webshimsの日付ピッカーの「view 0」のようなUIははるかに望ましいです（ただし、ユーザーが年を選択するとwebshims UIを終了する方法を理解できませんでした）。現在、私の他の解決策は、1900年以降のすべての年のドロップダウンで、 "1-1-YYYY"に設定されているので、このUIを破る必要があります。 – Guss
@Gussこの方が良いでしょうか？http://jsfiddle.net/vW8zc/306/ – LGSon
@Gussそして、前/次の矢印のないものもあります：http://jsfiddle.net/vW8zc/307/ ..もし十分なものがあれば教えてください。私の答えを更新してください – LGSon
私はこれで試してみましたが、CSSでは変更がありません。
$(function() {
$('#datepicker').datepicker({
changeYear: true,
showButtonPanel: true,
dateFormat: 'yy',
onClose: function(dateText, inst) {
var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
$(this).datepicker('setDate', new Date(year, 1));
}
});
$("#datepicker").focus(function() {
$(".ui-datepicker-month").hide();
$(".ui-datepicker-calendar").hide();
});
});<p>Date: <input type="text" id="datepicker" /></p>JavaScriptの解決策はこの質問に対する答えではありません。 – Blackbam
んが、あなたはいますが、回避策として、入力タイプ番号を使用したくないことはできません。次の例を見てください：
<input type="number" min="1900" max="2099" step="1" value="2016" />
シンプルで簡単。なぜ私はそれを考えなかったのですか？選択した回答である必要があります –
月と年を選択することができますinput type month in HTML5があります。月セレクタはオートコンプリートで動作します。
JSFiddleの例を確認してください。
答えをありがとう、私は 'type = month'をHTML5のオプションとして認識していませんでした（私は仕様へのリンクを追加しました）。 Githubは大きなファイルに対しては "非難された"ビューを提供しないので、いつ追加されたのか分かりません。それは私のニーズにとっては十分な解決策ではないと言われていましたが、標準で「年」タイプを追加するように私に影響を与えました：https://github.com/whatwg/html/issues/3281 。あなたもこのような機能に興味があるなら（今後5年以内にブラウザで利用できるようにするため）、投票してください。 – Guss
完了。上院議員に上乗せされた。 – Wallkicker
いいえ、できません。年だけはサポートされていないため、jQueryやWebshimリンクなどのスクリプトが必要です（年のみ表示）。 – LGSon
いくつかの良いjQueryサンプルについてこの記事をチェックしてください：http://stackoverflow.com/questions/13528623/jquery-ui-datepicker-to-show-year-only – LGSon
おそらくこの質問は、http：// stackoverflow.com/questions/30085591/focus-month-or-year-of-html5-inputtype-date ...あなたは同意しますか？ ... jQueryがオプションであれば、私の最初のコメントのリンクは二重引用符ですか？ – LGSon