html5 minlength,HTML5中是否有minlength验证属性?
回答(16)
3 years ago
如果想做出这种行为,
总是 show a small prefix on input field 或 the user can't erase a prefix :
//prefix="prefix_text"
//if the user change the prefix, restore the input with the prefix:
if(document.getElementById('myInput').value.substring(0,prefix.length).localeCompare(prefix))
document.getElementById('myInput').value = prefix;
3 years ago
minLength属性(与maxLength不同)在HTML5中本身不存在 . 但是,有一些方法可以验证字段是否包含少于x个字符 .
jQuery.validator.setDefaults({
debug: true,
success: "valid"
});;
$(document).ready(function(){
$("#myform").validate({
rules: {
field: {
required: true,
minlength: 3
}
}
});
});
Required, Minimum length 3:
3 years ago
我使用max和min然后需要它对我很有用,但不确定是否是一种编码方法 . 我希望它有所帮助
3 years ago
如果“类型”的值是其中之一:
text, email, search, password, tel, or url (警告:不包括 number | no browser support "tel" 现在 - 2017.10)
使用 minlength (/ maxlength)属性,它指定最小字符数 .
例如 .
或使用“模式”属性:
如果"type"是 number ,但不支持 minlength (/ maxlength),则可以使用 min (/ max)属性代替它 .
例如 .
3 years ago
添加最大值和最小值,您可以指定允许值的范围:
3 years ago
我注意到有时在chrome中自动填充打开并且字段是自动填充浏览器内置方法的字段时,它会绕过最小长度验证规则,因此在这种情况下,您必须通过以下属性禁用自动填充:
autocomplete="off"
3 years ago
我写了这个JavaScript代码,[minlength.js]:
window.onload = function() {
function testaFunction(evt) {
var elementos = this.elements;
for (var j = 0; j < elementos.length; j++) {
if (elementos[j].tagName == "TEXTAREA" && elementos[j].hasAttribute("minlength")) {
if (elementos[j].value.length < elementos[j].getAttribute("minlength")) {
alert("The textarea control must be at least " + elementos[j].getAttribute("minlength") + " characters.");
evt.preventDefault();
};
}
}
}
var forms = document.getElementsByTagName("form");
for(var i = 0; i < forms.length; i++) {
forms[i].addEventListener('submit', testaFunction, true);
}
}
3 years ago
如果 minlength 不起作用,请使用@ Pumbaa80提到的 pattern 属性作为 input 标记 .
For textarea: 用于设置最大值;使用 maxlength 和min去this link .
你会在这里找到最大和最小 .
3 years ago
新版本:
它扩展了使用(textarea和输入)并修复了错误 .
// Author: Carlos Machado
// Version: 0.2
// Year: 2015
window.onload = function() {
function testFunction(evt) {
var items = this.elements;
for (var j = 0; j < items.length; j++) {
if ((items[j].tagName == "INPUT" || items[j].tagName == "TEXTAREA") && items[j].hasAttribute("minlength")) {
if (items[j].value.length < items[j].getAttribute("minlength") && items[j].value != "") {
items[j].setCustomValidity("The minimum number of characters is " + items[j].getAttribute("minlength") + ".");
items[j].focus();
evt.defaultPrevented;
return;
}
else {
items[j].setCustomValidity('');
}
}
}
}
var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
var isChrome = !!window.chrome && !isOpera;
if(!isChrome) {
var forms = document.getElementsByTagName("form");
for(var i = 0; i < forms.length; i++) {
forms[i].addEventListener('submit', testFunction,true);
forms[i].addEventListener('change', testFunction,true);
}
}
}
3 years ago
如果要创建将模式用于“空或最小长度”的选项,则可以执行以下操作:
3 years ago
我使用jQuery的textarea解决方案并结合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
3 years ago
在我的情况下,我在手边验证最多并使用Firefox(43.0.4),遗憾的是 minlength 和 validity.tooShort 不可用 .
但由于我只需要存储最小长度以便继续,因此一种简单方便的方法是将此值分配给输入标记的另一个有效属性 . 在那种情况下,您可以从非文本类型输入(类型= "number")正确使用 min , max 和 step ,但仍然是输入 .
不是将这些限制存储在数组中,而是更容易找到它存储在同一输入中,而不是获取元素id以匹配数组索引 .
3 years ago
现在HTML5 spec中有 is minlength 属性,以及 validity.tooShort 接口 .
3 years ago
Here is HTML5-only solution (如果你想要minlength 5,maxlength 10字符验证)
http://jsfiddle.net/xhqsB/102/
3 years ago
我使用maxlength和minlength,有或没有 required ,它对我来说非常适合HTML5 .
`
3 years ago
不是HTML5,但实际上是实用的:如果您碰巧使用 AngularJS ,则可以使用ng-minlength作为输入和textareas . 另见this Plunk .
html5 minlength,HTML5中是否有minlength验证属性?相关推荐
- 掌财社:html5中AmazeUI框架中JS表单验证实战案例展示!
今天和大家分享个有关于"html5中AmazeUI框架中JS表单验证实战案例展示!"这方面的相关内容知识,让大家对于html5中AmazeUI框架也可以有所了解! 1.需求 做一个 ...
- php画布怎么清除,JavaScript_JavaScript html5 canvas画布中删除一个块区域的方法,本文实例讲述了html5 canvas画布 - phpStudy...
JavaScript html5 canvas画布中删除一个块区域的方法 本文实例讲述了html5 canvas画布中删除一个块区域的方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 附:图 ...
- html5中audio播放器标签属性整理
html5中audio播放器标签属性整理 HTML5 元素 audio播放器隐藏 audio标签控制函数功能说明 audio 可脚本控制的特性值 只读属性属性说明 HTML5 元素 元素是一个 HTM ...
- html5 webDatabase 存储中sql语句执行可嵌套使用
html5 webDatabase 存储中sql语句执行可嵌套使用,代码如下: var data = window.openDatabase("stu","1.0&quo ...
- [html] html5中的meta标签http-equiv属性有什么作用?
[html] html5中的meta标签http-equiv属性有什么作用? http-equiv是http5新增的属性,用于把 content 属性关联到 HTTP 头部,可模拟响应头.例如:con ...
- HTML5中拖动功能的添加属性,html5中可拖动dragable属性及其他成员的讲解
html5中可拖动dragable属性及其他成员的讲解 发布时间:2020-04-22 11:08:02 来源:亿速云 阅读:350 作者:小新 这篇文章主要为大家详细介绍了html5中可拖动drag ...
- 设计图片转换html5,在HTML5中翻转图片
貌似 HTML5 的 Canvas 只提供了图片的旋转.缩放功能,没有提供图片翻转(水平翻转或垂直翻转)的支持,搜索加试验之后,得到几种实现图片翻转的方法,记录一下. 第一种最简单的是使用 CSS,代 ...
- HTML5(李炎恢)学习笔记四 ------------- HTML5元素(中)
一.表格元素 HTML5中表格元素的用法.表格的主要用途是以网格的形式显示二维数 1.表格元素总汇 表格的基本构成最少需要三个元素:<table>.<tr>.<td> ...
- html5 dash,使用 DASH.js 在 HTML5 应用程序中嵌入 MPEG-DASH 自适应流式处理视频
您现在访问的是微软AZURE全球版技术文档网站,若需要访问由世纪互联运营的MICROSOFT AZURE中国区技术文档网站,请访问 https://docs.azure.cn. 使用 DASH.js ...
最新文章
- 剑指offer:第一个只出现一次的字符
- JProfiler 11中文版
- LED适用范围及寿命
- ASP.NET WebAPI 集成 Swagger 启用 OAuth 2.0 配置问题
- 多快好省的预训练模型:你丢我也丢
- Android activity跳转动画,6种activity进入动画
- java swing 组织机构_课内资源 - 基于Java Swing的小型社团成员管理系统
- 输出图片任意点的像素坐标(结合IRFANVIEW使用)
- 明晚直播丨一次特殊的 Oralce 硬解析性能问题的技术分享
- 海量个人信息被泄漏 央视首次曝光智能呼叫机器人
- BZOJ1345 [Baltic2007]序列问题Sequence
- codeforces 340E Iahub and Permutations(错排or容斥)
- amCharts: JavaScript/HTML5 charts 破解
- ICH E2B | ICSR 电子传输网关对接解决方案(CDE EDI)
- el-select和el-tree组成树下拉框以及数据回显
- 铂电阻测温电路c语言程序,pt100测温电路(经典测温范围)
- 凌晨三点的程序员,别让你的辛苦被辜负
- 计算机专业:考研 VS 工作
- CMMI(能力成熟度集成)四个等级
- 舌尖上的AI:人工智能技术正在被“端上”餐桌
热门文章
- 数据科学中必须知道的5个关于奇异值分解(SVD)的应用
- Winodws 10 如何安装wget
- Python 排序的姿势,你们,你们还要学习..学习一个
- Linux 交换空间管理和技巧
- 有向图最小路径覆盖方法浅析、证明 //hdu 3861
- 对10个整数按由大到小顺序排序
- 微型计算机的EMC设计视频,干货 | EMC设计有多难,看完这31个电磁兼容标准电路,瞬间懂了...
- python程序不出结果_超详细的Python入门教程,1小时就可以学会
- 计算机等级必须在学校考吗,计算机等级考试可以跳过一级考二级吗
- linux 读取命令行输入,Linux read命令的使用