web-dev-qa-db-ja.com

Mobile Safari（10.3.1）DateTime-Local "Enter a Valid Value"エラー

IOSのMobile Safariの新しいバージョンでエラーが発生します。このエラーは、バージョン10.3より前のiOSでは発生しませんでした。誰かが私をこれについて正しい方向に向けることができますか？

これが未加工のHTMLで、検査されたビューとモバイルデバイス（iPhone 7）のビューが添付されています。

Inspector ViewiPhone 7 View

iosiphonehtmlinputsafari
13
Mark Tomlin

シンプルなソリューション！

IOSでは、「datetime-local」のタイプの入力フィールドに値を設定する必要があります。

例：<input type="datetime-local" value="2000-07-01T12:00" />

それでおしまい ：）

個人的には、デフォルト値をユーザーの現在の現地時間に設定するのはいいことです。これは秒なしのISOTimeでフォーマットする必要があるため、このコードは次のようになります。

// get the iso time string formatted for usage in an input['type="datetime-local"']
var tzoffset = (new Date()).getTimezoneOffset() * 60000; //offset in milliseconds
var localISOTime = (new Date(Date.now() - tzoffset)).toISOString().slice(0,-1);
var localISOTimeWithoutSeconds = localISOTime.slice(0,16);

// select the "datetime-local" input to set the default value on
var dtlInput = document.querySelector('input[type="datetime-local"]');

// set it and forget it ;)
dtlInput.value = localISOTime.slice(0,16);
4
Frank Turano

このメッセージは、クライアント側の検証によってトリガーされます。クライアント側の検証を使用していない場合は、次のようにnovalidate属性を使用して無効にすることでこの問題を解決できることがわかりました。

<form action="/myaction" method="POST" novalidate>
4
Matt

Safariのバグのようですが、JavaScriptを使用してフォームを送信することでスキップできます。

$("#new_apply_form").submit();
3
Eric Guo

これはSafariのバグです。代わりに、JSを使用してフォームを送信する必要があります。

JS：form.submit();

1
Joshua

まだIOS datetime-localと私と同じように苦労している人のために。

これは、IOS set datetime-local value in invalid format when value attribute/property not set or set with invalid one。

<input type='datetime-local' onChange='alert(event.target.value)'>

これは、許可されていない秒の文字列を含む2018-12-25T12：00：00などの「yyyy-MM-ddThh：mm：ss」形式で警告します。

これをバイパスするには、有効な形式で値を設定するだけです。

const onChange = (event) => {
    event.target.value = event.target.value.substr(0, 16);
}

それで終わりです。

0
NamHoon Jung