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

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


当前回答

你可以在输入标签中使用minlength,或者你可以regex pattern来检查字符的数量,甚至你可以输入并检查字符的长度,然后你可以根据你的要求进行限制。

其他回答

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

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

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

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

我的解决方案textarea使用jQuery和结合HTML5需要验证,以检查最小长度。

minlength.js

$(document).ready(function(){
  $('form textarea[minlength]').on('keyup', function(){
    e_len = $(this).val().trim().length
    e_min_len = Number($(this).attr('minlength'))
    message = e_min_len <= e_len ? '' : e_min_len + ' characters minimum'
    this.setCustomValidity(message)
  })
})

HTML

<form action="">
  <textarea name="test_min_length" id="" cols="30" rows="10" minlength="10"></textarea>
</form>

在@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

我使用了最大值和最小值,这对我来说很有效,但我不确定这是否是一种编码方法。

<input type="text" maxlength="13" name ="idnumber" class="form-control"  minlength="13" required>

你可以在输入标签中使用minlength,或者你可以regex pattern来检查字符的数量,甚至你可以输入并检查字符的长度,然后你可以根据你的要求进行限制。