JavaScript正则表达式中type=number和type=text之间的区别是什么
What is difference between type=number and type=text in JavaScript regex?
脚本必须计数3个字符,并过滤任何非数字的字符。在任意3位数字之后,脚本将:"-";然后防止添加超过9位数字。
任何操作都很好,而我在输入中使用"type=text"。当我使用"type=number"(这对我的新任务很重要)时,脚本不起作用,好吧,(replace(/(.{3})/g,'$1 - ')
,在输入中放入最后3个字符[我想])。
我的问题是:
从正则表达式的角度来看,这两种类型之间是否存在差异?
也许"type=number"正在将字符串解析为int?(但正如我所知,pure(没有JS)"type=number"不会实时过滤任何内容)。
Ps。抱歉语言太糟糕了。
现在代码:
$(document).ready(function() {
var selection = document.querySelector('.correct_phone input[name=phone]');
//selection.setAttribute('type','number');
selection.addEventListener('input', function(e) {
selection.addEventListener('keydown', function(b) {
if (b.keyCode != 8 && b.keyCode != 46 && b.keyCode != 37 && b.keyCode != 39 && b.keyCode != 16 && b.keyCode != 17 && b.keyCode != 18) {
if (e.target.value.length < 14 && e.target.value.length > 0) {
$(selection).parent('.correct_phone').find('.error_list.not_digit').remove();
//e.target.value = e.target.value.replace(/[^'dA-Z]/g, '').replace(/(.{3})/g, '$1 ').trim(); /^'d+$/
e.target.value = e.target.value.replace(/[^'d]/g, '').replace(/(.{3})/g, '$1 - ').trim();
} else if (e.target.value.length > 14) {
$(selection).parent('.correct_phone').find('.error_list.not_digit').remove();
e.target.value = e.target.value.substring(0, e.target.value.length - 1);
$(selection).parent('.correct_phone').css('border-color', 'red').find('label').before("<ul style='margin-bottom:0px;' class='error_list not_digit'><li style=' font-size:1.1em;'>Nuber shuld contains only 9 digits</li></ul>");
$(selection).parent('.correct_phone').find('ul.error_list.not_digit').animate({
opacity: 0
}, 3000, function() {
$(this).remove();
});
}
} else
$(selection).parent('.correct_phone').find('.error_list.not_digit').remove();
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="fieldset semi correct_phone">
<label class="input-name">Phone:</label>
<input type="text" name="phone" value="" />
</div>
根据W3 input type="number"规范,type="number"
是为浮点数保留的。
具体来说,下面一行描述了您遇到的错误:
值净化算法如下:如果元素的值不是有效的浮点数,则将其设置为空字符串。
因此,在您的代码中,您将输入值设置为非浮点数:
e.target.value = e.target.value.replace(/[^'d]/g, '').replace(/(.{3})/g, '$1 - ').trim();
由于-
字符被视为错误输入,浏览器将遵循规范并将值设置为空字符串。
要解决此问题,您应该使用type="tel"
,它接受任何有效的电话号码作为输入:
<input type="tel" name="phone" value="" />
这将现代移动浏览器设置为显示数字键盘布局(如type="number"
.
相关文章:
- 函数参数中的数据与指定变量之间的任何性能差异
- 全局变量和全局对象的属性之间有什么区别吗
- java.net和javascript之间正则表达式的差异
- 如何将输入(type=text)从html表单传递到javascript函数
- JavaScript中的函数和对象之间没有区别吗?
- 正在将base64 jpeg从input-type=file上传到服务器
- 获取@ResponseBody的一部分作为主干和Spring MVC控制器之间的参数
- Jquery在函数之间传递表行
- 根据某些条件在视图之间切换
- 在控制器和数据对象之间同步数据
- d3中堆栈函数和嵌套函数之间的差异
- JQuery:在页面之间滑动
- 如何使用JavaScript查找1和N之间的所有数字的总和
- 操作放置在画布上的元素之间的连接
- 在下划线中使用_(obj).map(callback)和_.map(obj,callback)之间的区别
- jquery在表单之间切换
- Nodejs API控制器,用于在API之间切换
- type=text/javascript和language=javascript之间的区别
- JavaScript正则表达式中type=number和type=text之间的区别是什么
- typeof(/s/)和$.type(/s/)之间的差异