我有一个我不想在其中输入空格的文本输入.如果有人键入一个空格或将文本粘贴到一个空格,我想将文本更改回输入空格之前的状态,同时还要保持插入标记的位置相同.也许有一种更简单的方法可以执行此操作,但我无法弄清楚.
这是我到目前为止的内容：
<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/
解决方法:
您要捕获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;
}