ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

禁止在文本输入中键入或粘贴空格,并保持文本和插入符号的位置相同

2019-11-27 14:35:45  阅读:203  来源: 互联网

标签:validation input javascript


我有一个我不想在其中输入空格的文本输入.如果有人键入一个空格或将文本粘贴到一个空格,我想将文本更改回输入空格之前的状态,同时还要保持插入标记的位置相同.也许有一种更简单的方法可以执行此操作,但我无法弄清楚.

这是我到目前为止的内容:

<html><head><title>Test</title></head><body>

<input type=text id="inputText" value="testValue" onInput=doIt(this);>

</body></html>​

以及将要包含的JavaScript(我使用jsFiddle):

var editedValue = "testValue";

// alert(editedValue);

function doIt(that)
{

var caretPos = that.selectionStart;

if (that.value.indexOf(" ") != -1)
{
that.value = editedValue;
// alert(caretPos);
that.selectionStart = caretPos;
}
else
{
editedValue = that.value;
}

}​

似乎所有工作都可以,但是,如果插入标记位于文本的中间,并且您键入或粘贴空格,则插入标记不会返回到原始位置.

谁能帮我解决这个问题?还是给我展示一种全新的/更简便的方法来禁止在文本输入中键入或粘贴空格?

这是我尝试过的jsfiddle,如果有帮助的话:http://jsfiddle.net/djSnL/4/

解决方法:

http://jsfiddle.net/djSnL/5/

您要捕获onkeydown事件:

function doIt(e)
{
    var e = e || event;

    if (e.keyCode == 32) return false; // 32 is the keycode for the spacebar

}

window.onload = function(){
    var inp = document.getElementById("inputText");

    inp.onkeydown = doIt;
};

请注意,它们仍将能够在输入中粘贴空格,因此您也必须处理该问题.

要处理粘贴,它很简单:http://jsfiddle.net/djSnL/7/

function pasteIt(e)
{
    var e = e || event;

    this.value = this.value.replace(/\s/g,'');

}

同时使用,您将获得理想的效果.

我不确定100%,但是我相信只有Webkit浏览器才能在粘贴数据之前让您知道数据是什么:http://jsfiddle.net/djSnL/8/

function pasteIt(e)
{
    var e = e || event;
    var data = e.clipboardData.getData("text/plain");

    if (data.match(/\s/g)) return false;    
}

标签:validation,input,javascript
来源: https://codeday.me/bug/20191127/2075184.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有