web-dev-qa-db-ja.com

iPad / iPhoneでHTML5フォーム要素「必須」が機能しない

iPad safariはhtml5に準拠しているはずですが、必要な要素が機能しないようです。誰もが理由を知っていますか、または大量のJavaScriptを必要としない適切な回避策がありますか？

私のコード

<input type=email class=input placeholder="Email" name="email" required>
htmlformsmobile-safarirequiredhtml-validation
19
SongBox

IOSではまだサポートされていません： いつ使用できるか：必須 。

25
Ian Devlin

これは問題のjQueryソリューションであり、失敗した入力フィールドを小指で強調表示します。

$('form').submit(function(){
    var required = $('[required="true"]'); // change to [required] if not using true option as part of the attribute as it is not really needed.
    var error = false;

    for(var i = 0; i <= (required.length - 1);i++)
    {
        if(required[i].value == '') // tests that each required value does not equal blank, you could put in more stringent checks here if you wish.
        {
            required[i].style.backgroundColor = 'rgb(255,155,155)';
            error = true; // if any inputs fail validation then the error variable will be set to true;     
        }
    }

    if(error) // if error is true;
    {
        return false; // stop the form from being submitted.
    }
});
16
Eliot

IOS 10.3以降、この属性がサポートされています。また、メールタイプには@記号などを書く必要があります...

2
Matouš Bečvář

このような送信アクションの前に何かできると思います

_<form name="myForm" action="valid.html" onsubmit="checkValid()" method="post">
  ... ...
</form>
_

submitボタンを押すと、実際に送信する前にcheckValid()が呼び出されます。 trueの戻り値は送信アクションを続行します。

詳細については この投稿 を参照してください。:)

1
AgnesCat

すでにjQuery、Modernizr、yepnopeを使用している場合、これはそれに対処する1つの方法です。そうでない場合は、これにより多くのJavaScriptが追加されます。

私の解決策

1
Jbrown

PHPを使用している場合は、次のような検証を追加できます

function validation(){

  if(isset($_POST['submit'])){
  $email = $_POST['email'];

     if(empty($email)){
        echo $error = "Your email cannot be empty";

      } else {
        return true; //or do something next here
     }
   }

次に、この関数をphpのフォームの前に追加します。

0
C.Tom