3

この例では、必要な属性を持つ入力フィールドが 1 つしかなく、iOS Safari (iPhone/iPad) および IE9 で値が空の場合でもアラート OK が表示されます。Firefox と Chrome は正常に動作します。

私は何か見落としてますか?

<!DOCTYPE html>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <meta charset="utf-8">
        <title>jqBootstrapValidation by ReactiveRaven</title>

        <link rel="stylesheet" href="http://reactiveraven.github.com/jqBootstrapValidation/css/bootstrap.css">
        <script src="http://reactiveraven.github.com/jqBootstrapValidation/js/jQuery-1.7.2-min.js"></script>
        <script src="http://reactiveraven.github.com/jqBootstrapValidation/js/bootstrap.js"></script>
        <script src="http://reactiveraven.github.com/jqBootstrapValidation/js/jqBootstrapValidation.js"></script>

        <script>
            $(function() {
                $("input,textarea,select").jqBootstrapValidation(
                    {
                        preventSubmit: true,
                        submitError: function($form, event, errors) {
                            // Here I do nothing, but you could do something like display 
                            // the error messages to the user, log, etc.
                        },
                        submitSuccess: function($form, event) {
                            alert("OK");
                            event.preventDefault();
                        },
                        filter: function() {
                            return $(this).is(":visible");
                        }
                    }
                );
            });
        </script>

    </head>
    <body>
    <div class="tabbable">
        <ul class="nav nav-tabs">
            <li class="active"><a data-toggle="tab" href="#validators_required_preview">Example</a></li>
        </ul>
        <div class="tab-content">
            <div id="validators_required_preview" class="tab-pane active">
                <form class="form-horizontal">
                   <input name="some_field" required="" value="" type="text">
                   <button type="submit" class="btn btn-primary">Test Validation <i class="icon-ok icon-white"></i></button></form>
            </div>
        </div>
    </div>
</body></html>
4

2 に答える 2