`

JS控制 input 输入字符控制

阅读更多

ENTER键可以让光标移到下一个输入框
<input onkeydown="if(event.keyCode==13)event.keyCode=9" >

只能是中文
<input onkeyup="value=value.replace(/[ -~]/g,'')" onkeydown="if(event.keyCode==13)event.keyCode=9">

屏蔽输入法
<input style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9">

只能输入英文和数字
<input onkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" onkeydown="if(event.keyCode==13)event.keyCode=9">

只能是数字
<input onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">

只能显示,不能修改
<input readonly value="只能显示,不能修改">

只能输数字,判断按键的值
<script   language=javascript>
function   onlyNum()
{
if(!((event.keyCode>=48&&event.keyCode<=57)||(event.keyCode>=96&&event.keyCode<=105)||(event.keyCode==8)))
event.returnValue=false;
}
</script>
<input   onkeydown="onlyNum();">

 

 

1.文本框只能输入数字代码(小数点也不能输入)
<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">

2.只能输入数字,能输小数点.
<input onkeyup="if(isNaN(value))execCommand('undo')" onafterpaste="if(isNaN(value))execCommand('undo')">
<input name=txt1 onchange="if(/\D/.test(this.value)){alert('只能输入数字');this.value='';}">

3.数字和小数点方法二
<input type=text tvalue="" ovalue="" onkeypress="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;else this.tvalue=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.ovalue=this.value" onkeyup="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;else this.tvalue=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.ovalue=this.value" onblur="if(!this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?|\.\d*?)?$/))this.value=this.o_value;else{if(this.value.match(/^\.\d+$/))this.value=0+this.value;if(this.value.match(/^\.$/))this.value=0;this.ovalue=this.value}">

4.只能输入字母和汉字
<input onkeyup="value=value.replace(/[\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[\d]/g,''))" maxlength=10 name="Numbers">

5.只能输入英文字母和数字,不能输入中文
<input onkeyup="value=value.replace(/[^\w\.\/]/ig,'')">

6.只能输入数字和英文 <font color="Red">chun</font>
<input onKeyUp="value=value.replace(/[^\d|chun]/g,'')">

7.小数点后只能有最多两位(数字,中文都可输入),不能输入字母和运算符号:
<input onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || /\.\d\d$/.test(value))event.returnValue=false">

8.小数点后只能有最多两位(数字,字母,中文都可输入),可以输入运算符号:
<input onkeyup="this.value=this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')">

只能是数字和小数点和加减乘際

 

9.只能输入数字、小数点、负数

<input name="input" type="text" onkeyup="JHshNumberText(this)" id="title">
<br>

<script language="javascript" type="text/javascript">
function JHshNumberText(a)
{
var fa="";
if(a.value.substring(0,1)=="-")
      fa="-";

var str=(a.value.replace(/[^0-9.]/g,'')).replace(/[.][0-9]*[.]/, '.');

if (str.substring(0,1)==".")
   str="0"+str;
   a.value=fa+str;

}
</script>

1.取消按钮按下时的虚线框,在input里添加属性值 hideFocus 或者 HideFocus=true
<input type="submit" value="提交" hidefocus="true" />

2.只读文本框内容,在input里添加属性值 readonly
<input type="text" readonly />

3.防止退后清空的TEXT文档(可把style内容做做为类引用)
<input type="text" style="behavior:url(#default#savehistory);" />

4.ENTER键可以让光标移到下一个输入框
<input type="text" onkeydown="if(event.keyCode==13)event.keyCode=9" />

5.只能为中文(有闪动)
<input type="text" onkeyup="value=value.replace(/[ -~]/g,'')" onkeydown="if(event.keyCode==13)event.keyCode=9" />

6.只能为数字(有闪动)
<input type="text" onkeyup="value=value.replace(/[^\d]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" />

7.只能为数字(无闪动)
<input type="text" style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9" onkeypress="if ((event.keyCode<48 || event.keyCode>57)) event.returnValue=false" />

8.只能输入英文和数字(有闪动)
<input type="text" onkeyup="value=value.replace(/[\W]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" />

9.屏蔽输入法
<input type="text" name="url" style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9" />

10. 只能输入 数字,小数点,减号(-) 字符(无闪动)
<input onkeypress="if (event.keyCode!=46 && event.keyCode!=45 && (event.keyCode<48 || event.keyCode>57)) event.returnValue=false" />

11. 只能输入两位小数,三位小数(有闪动)
<input type="text" maxlength="9" onkeyup="if(value.match(/^\d{3}$/))value=value.replace(value,parseInt(value/10)) ;value=value.replace(/\.\d*\./g,'.')" onkeypress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 && event.keyCode!=45 || value.match(/^\d{3}$/) || /\.\d{3}$/.test(value)) {event.returnValue=false}" />

 

中企速联

分享到:
评论

相关推荐

    JS控制 input 输入字符限制

    在JavaScript中,对`input`元素的输入进行字符限制是一种常见的前端验证技术,它能确保用户输入的数据符合特定格式或规则,从而提高数据质量和用户体验。本文将深入探讨如何使用JavaScript和正则表达式来实现这一...

    js实现input限制输入字符(字节)数多出的自动去掉

    js实现input限制输入字符(字节)数多出的自己自动去掉

    JS控制input_输入字符限制

    本文将详细讲解如何使用JavaScript控制`input`输入的字符限制,包括限制输入类型、屏蔽输入法以及禁用编辑等。 1. **键盘事件与按键码**: `keydown`和`keyup`事件常用来监听用户在输入框中的按键操作。例如,通过...

    js控制input输入字符解析

    这篇文章详细介绍了JavaScript中如何控制HTML中的input元素输入字符的多种方法,包括限制用户输入的字符类型、屏蔽输入法、限制输入的数字和小数点等。下面将对这些方法逐一进行说明。 1. 防止光标跳到下一个输入框...

    用JS控制INPUT输入内容

    ### 使用JavaScript控制INPUT输入内容详解 #### 一、概述 在网页开发中,为了提高用户体验并确保数据的有效性,我们经常需要对用户输入的数据进行控制和验证。通过使用JavaScript(简称JS),我们可以轻松地实现这...

    控制input输入的长度尺寸

    * maxlength:用于指定用户可输入字符串的最大长度。 * emptyok:用于指定用户是否可以不在输入框内输入内容。 * size:用于指定输入框的宽度,宽度值为字符个数。 * tabindex:用于指定多个输入框存在时,类似于 ...

    Javascript控制input输入时间格式的方法

    本文将详细介绍如何使用JavaScript来控制input元素中时间格式的输入,...希望以上知识点能帮助大家更好地理解如何使用JavaScript控制input输入时间格式,并且能够灵活应用鼠标事件及正则表达式来实现更丰富的交互效果。

    js各种限制input输入汇总

    ### JS各种限制input输入汇总知识点解析 #### 一、取消按钮按下时的虚线框 在Web开发过程中,用户点击按钮或输入框等元素时,可能会出现边框高亮的效果,这种效果通常是为了提高交互性而设计的。但在某些场景下,...

    js控制输入中英文字符数

    // 设置最大输入字符数,例如设为20个字符 const maxCount = 20; if (charCount &gt; maxCount) { // 当超过最大字符数时,阻止进一步输入 inputElement.value = text.slice(0, -1); // 去掉最后一个字符 alert('...

    javascript 控制input只允许输入的各种指定内容.docx

    ### JavaScript 控制 input 只允许输入的指定内容详解 #### 概述 在网页表单设计中,确保用户输入的数据符合预期格式是非常重要的一步。利用 JavaScript 对 input 输入框进行限制,能够有效提升用户体验并减少后端...

    禁止输入特殊字符的js

    这些js禁止输入特殊字符,使用起来还是非常方便。本人使用的心得分享大家一起看。如果大家觉得好用希望给个好评!

    JS input正则验证大全

    在JavaScript编程中,正则表达式...总之,“JS input正则验证大全”提供了JavaScript中常见的输入验证方法,对于前端开发者来说,是一个非常实用的参考资料。通过深入理解和实践,可以提升输入数据的有效性和安全性。

    JavaScript过滤SQL注入字符

    return input.replace(/[\x00-\x1f]/g, "") // 去除控制字符 .replace(/[-'\"]/g, "\\$&") // 转义特殊字符 .replace(/\x5c/g, "\\\\"); // 转义反斜杠 } ``` 三、使用正则表达式增强验证 正则表达式可以更精确...

    js控制文本框禁止输入特殊字符详解

    当用户在文本框中输入字符并释放键盘按键时,这个事件处理器会被触发。在事件处理器中,我们可以调用JavaScript代码来修改input的value,以便过滤掉不想要的特殊字符。 ### 知识点三:onpaste和oncontextmenu事件 ...

    javascript经典特效---检测输入字符个数.rar

    counter.textContent = '已输入字符数:' + inputElement.value.length; } &lt;input type="text" id="inputField" oninput="countCharacters(this)"&gt; 已输入字符数:0 ``` 在这个示例中,我们创建了一个`...

    js-input输入框提示语

    在JavaScript(JS)中,`input`元素是HTML5中用于用户输入数据的基本组件,它在各种表单和交互式页面设计中起着至关重要的作用。`input`元素的提示语,也称为占位符(placeholder),是显示在输入框内的一段文本,...

    输入字符的控制.rar

    压缩包内的文件“输入字符的控制”可能包含了上述各种情况的代码实例,帮助开发者更好地理解和应用输入字符控制的技术。学习和理解这些知识点,对于编写健壮、安全的软件至关重要。通过实践和调试这些代码,开发者...

    js控制文本框只能输入正整数和逗号

    ### JavaScript 控制文本框只能输入正整数和逗号 在Web开发中,为了提高用户体验并确保数据的有效性,我们经常需要对用户输入的数据进行验证。例如,在某些场景下,可能需要用户仅能输入正整数和逗号,以便于后续...

    js-input事件处理复合字符事件html示例

    这些事件可以帮助你跟踪用户在输入框中输入、编辑和删除文本的过程,并包含输入字符事件完整生命周期触发讲解,对应需要掌握输入事件的有作用,当监听input事件只需要输入字符或复活字符事件时可按input和...

Global site tag (gtag.js) - Google Analytics