javascript中的各种输入限制

最新推荐文章于 2023-06-19 12:47:23 发布
最新推荐文章于 2023-06-19 12:47:23 发布
阅读量663 收藏 1
点赞数
分类专栏： web开发 java之路 文章标签： javascript character scroll input 输入法 html

1.文本框输入限制

实现限制输入大、小写英文，数字，浮点小数，日期，中文，部分英文，部分中文等众多功能。直接加入到html代码中即可使用。

<script>
function regInput(obj, reg, inputStr)
{
var docSel = document．selection.createRange()
if (docSel.parentElement().tagName != "INPUT") return false
oSel = docSel.duplicate()
oSel.text = ""
var srcRange = obj.createTextRange()
oSel.setEndPoint("StartToStart", srcRange)
var str = oSel.text + inputStr + srcRange.text.substr(oSel.text.length)
return reg.test(str)
}
</script>

小写英文：<xmp style= "display:inline"> </xmp>
<input onkeypress = "return regInput(this, /^[a-z]*$/, String.fromCharCode(event.keyCode))"
onpaste = "return regInput(this, /^[a-z]*$/, window.clipboardData.getData('Text'))"
ondrop = "return regInput(this, /^[a-z]*$/, event.dataTransfer.getData('Text'))"
style="ime-mode:Disabled"><br>

大写英文：<xmp style= "display:inline"> </xmp>
<input onkeypress = "return regInput(this, /^[A-Z]*$/, String.fromCharCode(event.keyCode))"
onpaste = "return regInput(this, /^[A-Z]*$/, window.clipboardData.getData('Text'))"
ondrop = "return regInput(this, /^[A-Z]*$/, event.dataTransfer.getData('Text'))"
style="ime-mode:Disabled">
<br>

任意数字：<xmp style="display:inline"> </xmp>
<input onkeypress = "return regInput(this, /^[0-9]*$/, String.fromCharCode(event.keyCode))"
onpaste = "return regInput(this, /^[0-9]*$/, window.clipboardData.getData('Text'))"
ondrop = "return regInput(this, /^[0-9]*$/, event.dataTransfer.getData('Text'))"
style="ime-mode:Disabled"><br>

限2位小数：<xmp style="display:inline"> </xmp>

 


<input onkeypress = "return regInput(this, /^/d*/.?/d{0,2}$/,
String.fromCharCode(event.keyCode))"
onpaste = "return regInput(this, /^/d*/.?/d{0,2}$/,
window.clipboardData.getData('Text'))"
ondrop = "return regInput(this, /^/d*/.?/d{0,2}$/,
event.dataTransfer.getData('Text'))"
style="ime-mode:Disabled">

如: 123.12<br>

日　 期：<xmp style="display:inline"> </xmp>

<input onkeypress = "return regInput(this, /^/d{1,4}
([-//](/d{1,2}([-//](/d{1,2})?)?)?)?$/,
String.fromCharCode(event.keyCode))"

onpaste = "return regInput(this, /^/d{1,4}([-//](/d{1,2}
([-//](/d{1,2})?)?)?)?$/,
window.clipboardData.getData('Text'))"

ondrop = "return regInput(this, /^/d{1,4}([-//](/d{1,2}
([-//](/d{1,2})?)?)?)?$/,
event.dataTransfer.getData('Text'))"

style="ime-mode:Disabled">

如: 2002-9-29<br>

任意中文：<xmp style="display:inline"> </xmp>

<input onkeypress = "return regInput(this, /^$/,
String.fromCharCode(event.keyCode))"

onpaste = "return regInput(this, /^[/u4E00-/u9FA5]*$/,
window.clipboardData.getData('Text'))"

ondrop = "return regInput(this, /^[/u4E00-/u9FA5]*$/,
event.dataTransfer.getData('Text'))"><br>

部分英文：<xmp style="display:inline"> </xmp>
<input onkeypress = "return regInput(this, /^[a-e]*$/,
String.fromCharCode(event.keyCode))"

onpaste = "return regInput(this, /^[a-e]*$/,
window.clipboardData.getData('Text'))"

ondrop = "return regInput(this, /^[a-e]*$/,
event.dataTransfer.getData('Text'))"

style="ime-mode:Disabled">

范围: a,b,c,d,e<br>

部分中文：<xmp style="display:inline"> </xmp>
<script language=javascript>

function checkChinese(oldLength, obj)
{
var oTR = window.document．selection.createRange()
var reg = /[^一二三四五六七八九十]/g
oTR.moveStart("character", -1*(obj.value.length-oldLength))
oTR.text = oTR.text.replace(reg, "")
}
</script>

<input οnkeypress="return false" οnkeydοwn=
"setTimeout('checkChinese('+this.value.length+','+this.uniqueID+')',
1)"

onpaste = "return regInput(this, /^[一二三四五六七八九十]*$/,
window.clipboardData.getData('Text'))"

ondrop = "return regInput(this, /^[一二三四五六七八九十]*$/,
event.dataTransfer.getData('Text'))">

范围: 一二三四五六七八九十<br>

2.不能展开右键，不能全选，不能复制的实现

<body οncοntextmenu="window.event.returnvalue=false"
οnkeypress="window.event.returnvalue=false"
οnkeydοwn="window.event.returnvalue=false"
οnkeyup="window.event.returnvalue=false"
οndragstart="window.event.returnvalue=false"
onselectstart="event.returnvalue=false">
...
</body>

3.禁止页面正文内容被选取

<body οncοntextmenu="return false" οndragstart="return false"
onselectstart ="return false" οnselect="document．selection.empty()"
οncοpy="document．selection.empty()" onbeforecopy="return false"οnmοuseup="document．selection.empty()">

4.避免别人把网页放在框架中

<script language=“javascript”><!--if (self!=top){top.location=self.location;}-->< /script>

5.禁示查看源代码

<frameset>
<frame src="你要保密的文件的URL">
</frameset>

6.关闭输入法

<input style="ime-mode:disabled">

7.禁止图片下载

在这里的最后加入：

οncοntextmenu="return false" οndragstart="return false" onselectstart="return
false" scroll="auto"

8.禁止缓存

在HEAD里加入：

<meta http-equiv="Expires" CONTENT="0">
<meta http-equiv="Cache-Control" CONTENT="no-cache">
<meta http-equiv="Pragma" CONTENT="no-cache">

 

贴的出处：http://www.blogjava.net/dreamstone/archive/2007/09/10/144013.html

qlrhoo
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript 限制输入脚本大全
10-29
javascript限制输入脚本大全 ,方便网页设计的朋友经常能用的到，建议收藏下。代码有点慢，大家慢慢看啊。
js限制input标签中只能输入中文
10-24
主要介绍了js限制input标签中只能输入中文的的相关资料,需要的朋友可以参考下
js限制input输入
weixin_33674976的博客
02-08 425
1.取消按钮按下时的虚线框,在input里添加属性值 hideFocus 或者 HideFocus=true<input type="submit" value="提交" hidefocus="true" /> 2.只读文本框内容,在input里添加属性值 readonly<input type="text" readonly /> 3.防止退后清空的TEXT文档(可把...
js限制输入框的输入类型
最新发布
Guojun19900715的博客
06-19 637
js 限制input等输入框的输入类型(数字, 数字和字母, 身份证号, 中文 等
js控制输入6大方法
小小步
08-27 235
ENTER键可以让光标移到下一个输入框 只能是中文 只能是英文和数字.屏蔽了输入法 只能输入英文和数字 只能是数字 只能显示，不能修改的文本框...
javascript中的各种输入限制(转)
蛤蟆仙人
03-18 114
1.文本框输入限制 实现限制输入大、小写英文，数字，浮点小数，日期，中文，部分英文，部分中文等众多功能。直接加入到html代码中即可使用。 &lt;script&gt; function regInput(obj, reg, inputStr) { var docSel = document．selection.createRange() if (docSel.paren...
js限制文本框只能输入数字HTML
SELECT_BIN的博客
07-03 349
对于有的展示框需要提供可编辑功能的， 尤其是在表格里面的操作： 本人前端萌新，留着自己用，也供大家参考：这里用的onkeyup HTML： <td th:text="${map.count}" th:id="count+(${indexInc.index}+1)" onkeyup="isNumber(this)" contenteditable="true">&...
javascript限制文本框输入值类型的方法
10-24
结合以上三个事件的处理，我们就构建了一个基本的输入限制机制，确保文本框只接受数字和小数点。这种方法在实时验证用户输入、防止错误数据输入的场景中非常有用，尤其是在金融、电子商务等对数据精度要求较高的领域...
ReactAngularEmber和纯JavaScript的输入格式限制控件
08-07
对于纯JavaScript环境，我们没有框架的便利性，但依然可以实现输入限制。HTML5提供了`pattern`属性用于基本的正则表达式验证，但我们通常需要在`addEventListener`中监听`input`或`change`事件，然后用JavaScript...
JS常用正则表达式和JS控制输入框输入限制(数字、汉字、字符)
jp2021的博客
10-25 6665
JS常用正则表达式和JS控制输入框输入限制(数字、汉字、字符)
js实现禁止中文输入的方法
09-29
在一些页面输入框有时只能输入数字，英文字符，不允许输入汉字，使用该方法可以自动禁止输入汉字
JS控制文本框textarea输入字数限制的方法
10-27
JS控制文本框textarea输入字数限制的方法，需要的朋友可以参考一下
JS 对输入框进行限制(常用的都有)
12-01
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
限制字符输入数功能(jquery版和原生JS版)
12-12
已知BUG: Ubuntu系统下, onkeyup事件失效,详见: Ubuntu系统下onkeyup/onkeydown对中文输入失效bug. 查看演示: 点此查看DEMO 核心代码: 代码如下: //原生JavaScript版本 [removed]=function(){ var js=document.getElementById(‘js’);//获取文本域 var info=document.getElementsByTagName(‘p’)[0];//获取要插入提示信息的元素 var submit=info.getElementsByTagName(‘input’)[0];/
JS简单限制textarea内输入字符数量的方法
10-23
主要介绍了JS简单限制textarea内输入字符数量的方法,涉及JavaScript响应鼠标及键盘事件处理textarea输入框字符的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
关于处理禁止图片默认拖拽行为动作
weixin_34348805的博客
08-21 1459
今天在写一个js拖拽的时候，遇到一个小问题。。就是浏览器默认允许拖拽图片。 这样子我鼠标移动的时候，没有触发onmousemove事件绑定的函数。操作起来很别扭。。后来自己整理了一下。。一共有三个办法可以解决这个问题。。具体哪个办法更优，现在还不清楚。以后有能力判断优劣的时候再判断吧 1、document.images[i].ondragstart=function (){return f...
H5 学习笔记（day01） 拖放API、dataTransfer对象
DragonLoveYQ的博客
11-21 320
拖放事件 在H5中，任何元素都支持拖放，但是需要注意的是，有些元素存有默认事件比如（ a元素 )，应当取消该元素的默认事件 使用 preventDefault() 取消事件的默认动作 用法 ele.preventDefault() 拖动事件 事件 概述 ondragstart 当元素开始被拖动时触发——开始拖动 ondrag 拖动时触发（不管鼠标有没有移动）——正在拖动 ondragend 元素在拖动操作结束（放置）时——拖动结束 注意:ondrag事件在拖动元素时
html拖拽事件
weixin_45454695的博客
02-11 544
拖放：drag 和 drop。抓取对象以后拖到另一个位置。 1.设置元素为可拖动 把 draggable 属性设置为 true ： 例如：<div draggable="true" ></div> 2.事件 ondragstart - 用户开始拖动元素时触发 ondrag - 元素正在拖动时触发(鼠标可能在移动也可能未移动) ondragend - 用户完成元素拖动后触发 ...
js控制输入法关闭
startcodingnoend的博客
11-17 2482
要在paid网页端写一个input，里面输入的是日期，但是每次我点击的时候，paid的输入法就会自动弹出从而不能选择日期。
JavaScript代码实现文本框输入限制
除了以上基础的输入限制，还可以进行更复杂的限制，比如限制小数点后的位数。例如，如果需要限制小数点后最多只能输入两位数字，同时允许输入数字和中文，但不允许字母和运算符号，可以使用如下的代码： ```html (...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值