前言
用于记录开发中常用到的,快捷开发
简单实例
<input type="text" name="noSecretKeyJson" maxlength="200" />
常用事件
oninput (在用户输入时触发)及案例
案例一:限制只允许输入数字
<input type="text" name="noSecretKeyJson" maxlength="200" oninput="value=value.replace(/[^\d]/g,'')"/>
案例二:限制输入字体个数
<input type="text" name="coSecretKeyJson" oninput="if(value.length>8)value=value.slice(0,8)"/>
onchange(在用户输入失去光标时触发) 及案例
案例一:限制只允许输入数字和字符
<input type="text" name="coSecretKeyJson" style="float:left;width: 85%;" class="form-control" onchange='handleInput(event)' />
function handleInput(event) {
const inputValue = event.target.value;
const nonChineseRegex = /[^a-zA-Z0-9]/g; // 非中文字符的正则表达式
const filteredValue = inputValue.replace(nonChineseRegex, ''); // 过滤掉非中文字符
event.target.value = filteredValue; // 将输入框的值设置为过滤后的值
console.log(event.target.value)
}
案例一实现效果
文章来源:https://www.toymoban.com/news/detail-568167.html
总结
后续用到的我会继续写进去,如果有大佬遇到其他常用的,欢迎评论文章来源地址https://www.toymoban.com/news/detail-568167.html
到了这里,关于HTML input text 常用事件的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!