<input>字段的minlength属性似乎不起作用。

在HTML中是否有其他属性可以帮助我设置字段值的最小长度?


当前回答

是的,在那儿。就像maxlength。W3.org文档: http://www.w3.org/TR/html5/forms.html#attr-fe-minlength

如果minlength不起作用,可以使用@Pumbaa80提到的模式属性作为输入标记。

文本区域: 用于设置最大值;使用maxlength和min转到这个链接。

你会发现这里有最大值和最小值。

其他回答

同时添加最大值和最小值。您可以指定允许的值的范围:

<input type="number" min="1" max="999" />

这是html5的唯一解决方案(如果你想要minlength 5, maxlength 10字符验证)

http://jsfiddle.net/xhqsB/102/

< >形式 <输入模式= "。{5 10}" > <input type="submit" value="Check"></input> > < /形式

minLength属性(不像maxLength)在HTML5中并不存在。但是,如果字段包含少于x个字符,则有一些方法可以验证字段。

一个使用jQuery的例子:http://docs.jquery.com/Plugins/Validation/Methods/minlength

<html>
    <head>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
        <script type="text/javascript">
            jQuery.validator.setDefaults({
                debug: true,
                success: "valid"
            });;
        </script>

        <script>
            $(document).ready(function(){
                $("#myform").validate({
                    rules: {
                        field: {
                            required: true,
                            minlength: 3
                        }
                    }
                });
            });
        </script>
    </head>

    <body>
        <form id="myform">
            <label for="field">Required, Minimum length 3: </label>
            <input class="left" id="field" name="field" />
            <br/>
            <input type="submit" value="Validate!" />
        </form>
    </body>

</html>

在@user123444555621固定答案。

在HTML5中有一个minlength属性,但由于某种原因,它可能并不总是像预期的那样工作。

我有一个情况下,我的输入类型文本不遵守minlength="3"属性。

通过使用pattern属性,我设法解决了这个问题。 下面是一个使用pattern来确保minlength验证的例子:

const folderNameInput = document.getElementById("folderName"); folderNameInput.addEventListener('focus', setFolderNameValidityMessage); folderNameInput.addEventListener('input', setFolderNameValidityMessage); function setFolderNameValidityMessage() { if (folderNameInput.validity.patternMismatch || folderNameInput.validity.valueMissing) { folderNameInput.setCustomValidity('The folder name must contain between 3 and 50 chars'); } else { folderNameInput.setCustomValidity(''); } } :root { --color-main-red: rgb(230, 0, 0); --color-main-green: rgb(95, 255, 143); } form input { border: 1px solid black; outline: none; } form input:invalid:focus { border-bottom-color: var(--color-main-red); box-shadow: 0 2px 0 0 var(--color-main-red); } form input:not(:invalid):focus { border-bottom-color: var(--color-main-green); box-shadow: 0 2px 0 0 var(--color-main-green); } <form> <input type="text" id="folderName" placeholder="Your folder name" spellcheck="false" autocomplete="off" required minlength="3" maxlength="50" pattern=".{3,50}" /> <button type="submit" value="Create folder">Create folder</button> </form>

有关更多详细信息,这里是HTML模式属性的MDN链接:https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern

我使用maxlength和minlength,无论是否需要,它对我来说都非常适合HTML5。

<输入id=“passcode”类型=“minlength”密码=“8”,maxlength=“10”>

`