`
dreamstone
  • 浏览: 289048 次
  • 来自: ...
文章分类
社区版块
存档分类

js 输入限制

阅读更多
1.文本框输入限制

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

<script>
function regInput(obj, reg, inputStr)
{
var docSel = document.selection.createRange<wbr>()
if (docSel.parentElement().tagName != "INPUT") return false
oSel = docSel.duplicate()
oSel.text = ""
var srcRange = obj.createTextRange()
oSel.setEndPoint("StartToStart<wbr>", 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})?<wbr>)?)?)?$/,
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<wbr>.createRange()
var reg = /[^一二三四五六七八九十]/g
oTR.moveStart("character", -1*(obj.value.length-oldLength))
oTR.text = oTR.text.replace(reg, "")
}
</script>

<input onkeypress="return false" onkeydown=
"setTimeout('checkChinese('<wbr>+this.value.length+','+this<wbr>.uniqueID+')',
1)"

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

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

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

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

<body oncontextmenu="window.event.returnvalue=false"
onkeypress="window.event.returnvalue=false"
onkeydown="window.event.returnvalue=false"
onkeyup="window.event.returnvalue=false"
ondragstart="window.event.returnvalue=false"
onselectstart="event.returnvalue=false">
...
</body>

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

<body oncontextmenu="return false" ondragstart="return false"
onselectstart ="return false" onselect="document.selection<wbr>.empty()"
oncopy="document.selection<wbr>.empty()" onbeforecopy="return false"onmouseup="document<wbr>.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.禁止图片下载

在这里的最后加入:

oncontextmenu="return false" ondragstart="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"></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>
分享到:
评论

相关推荐

    js文本框限制输入 多种情况

    ### JS文本框限制输入多种情况知识点详解 #### 一、限制文本框只能输入数字(不允许输入小数点) 为了实现这一功能,可以采用`onkeyup`事件与正则表达式结合的方法来过滤非数字字符。具体实现代码如下: ```html ...

    js限制文本框只输入正整数

    在探讨如何利用JavaScript限制文本框只输入正整数这一主题时,我们首先应当明确目标:确保用户在文本框中输入的数据仅包含正整数,即非负整数(不包括小数、负数以及任何非数字字符)。这在许多场景下至关重要,比如...

    js限制文本框输入内容

    在实际应用中,开发者可能需要根据具体需求对这些知识点进行组合和扩展,以实现更加灵活和个性化的输入限制。例如,结合HTML5的`pattern`属性可以在HTML层面对输入格式进行初步约束,再配合JavaScript进行二次校验。...

    输入字数限制百分比的js超好用

    在JavaScript(JS)中,对输入的字数进行限制是一项常见的需求,特别是在用户交互界面设计时,例如评论、表单填写等场景。标题"输入字数限制百分比的js超好用"指的是一个JS功能,它能帮助开发者限制用户输入的字符数...

    原生js text文本框输入字数限制长度提示

    以下将详细介绍如何使用原生JavaScript实现文本框输入字数限制及长度提示。 首先,我们需要获取到文本框元素,并设置一个最大输入字数。这可以通过HTML的`maxlength`属性完成,例如: ```html ``` 这个例子中,...

    js限制input小数点前几位后几位

    1、可以动态设置小数点的前几位和后几位,进行实时校验;...2、通过正则表达式判断,超过设置的范围就不能输入了; 3、只能输入数字和小数点; 4、已经封装好的插件,可以直接使用。有使用的示例和必要的注释。

    javascript 表单输入内容限制

    ### JavaScript表单输入内容限制详解 #### 一、引言 在Web开发中,表单是用户与网站交互的...此外,还可以结合正则表达式的强大功能,实现更为复杂的输入限制逻辑。希望本文能够帮助读者更好地理解并掌握这些技巧。

    js正则表达式限制文本框只能输入字母和汉字

    ### 正则表达式在JavaScript中的应用:限制文本框只能输入字母和汉字 在Web开发过程中,表单验证是一项常见的任务。确保用户输入的数据符合预期的格式有助于提高数据的准确性和安全性。本篇文章将深入探讨如何使用...

    js限制输入框输入字数

    输入框控制输入字数 超出 不让输入 并提示

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

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

    表单输入限制方法代码

    JavaScript(简称JS)作为前端开发的主要语言之一,提供了多种方法来限制和控制用户在表单中的输入,以满足特定的数据格式或业务需求。下面将详细解析上述提到的几种表单输入限制方法代码: ### 1. 仅允许数字输入 ...

    js完美解决jsp文本框限制只能输入数字、小数问题

    ### js完美解决JSP文本框限制只能输入数字、小数问题 在Web开发过程中,确保用户输入的数据符合预期格式是一项非常重要的任务。特别是在涉及到数值输入时,开发者常常需要限制文本框仅能接受数字或者带有一定数量...

    js各种限制input输入汇总

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

    文本框的输入限制

    总之,“文本框的输入限制”这个话题涵盖了前端和后端的多种技术,包括HTML5属性、JavaScript事件处理、服务器端验证以及移动应用开发中的输入控制。理解并熟练运用这些方法,有助于构建更健壮、更安全的用户界面。...

    字数输入限制按百分比例显示代码

    总结起来,"字数输入限制按百分比例显示代码"是通过结合HTML、CSS和JavaScript来实现的一种交互式用户体验优化技术。它不仅限制了用户输入的字符数,还提供了实时反馈,使用户清楚地知道他们已输入的字符占最大允许...

    js限制DIV输入回车

    标题"js限制DIV输入回车"所涉及的知识点,就是如何使用JavaScript来阻止或改变`div`内的回车事件默认行为。在描述中提到,可以更改回车的功能,比如将回车键映射为输入特定的文字,如“你好我好大家好”。 首先,...

    使用JavaScript限制TextArea多行文本域的可输入字数

    总结起来,通过JavaScript我们可以轻松地实现对`&lt;textarea&gt;`的字数限制功能,包括监听输入事件、检查字符数、限制输入以及提供实时反馈。这样的功能对于优化用户界面和提高网站质量具有重要意义。通过结合源码和工具...

    js限制textarea每行输入字符串长度的代码.docx

    在JavaScript中,对`textarea`元素进行输入字符串长度限制是一个常见的需求,特别是在处理用户输入时,需要确保数据格式的正确性。在HTML中,`textarea`控件不像`input[type="text"]`那样可以直接通过`maxlength`...

    js正则表达式限制文本框只能输入数字,能输小数点.

    ### 正则表达式在JavaScript中的应用:限制文本框只能输入数字及小数点 在Web开发中,经常需要对用户输入的数据进行合法性验证。为了确保数据格式正确且符合预期,开发者通常会在前端使用JavaScript结合HTML来实现...

    JS屏蔽键盘输入 屏蔽键盘

    JS屏蔽键盘输入 JS屏蔽键盘输入JS屏蔽键盘输入 JS屏蔽键盘输入

Global site tag (gtag.js) - Google Analytics