您能否进行允许您键入文本但不允许删除文本的文本输入?



我一直在研究如何防止用户删除文本框中的文本和其他类似问题,但我找不到如何做到这一点。

你如何"能够写文本",但"不能删除文本"。例如,是否可以在按下退格键或删除时不执行任何操作?

我还没有在这个问题上得到线索,所以我真的没有任何代码可以在演示中显示。

只是为了澄清:

我正在尝试制作一个<input type='text'/>,它允许您输入它,但不能删除里面的文本。可能吗?我很确定这是可能的,但我还没有找到这个问题的答案。

如果它是"可能的",那么我需要它是纯Javascript。除了纯javascript,css和html之外,我真的不喜欢其他东西。

编辑:

感谢评论员,我现在有几件事需要注意,例如onChange事件。我会同时尝试自己做这件事......

谢谢@Isacc回答我一半的问题。我现在就去接受答案。我很确定我现在可以自己解决其余的问题。我所需要的只是一些代码开始。

@ARN,这刚刚解决了其余大部分问题!谢谢!:D

@Kavian_K,我真的很感谢你试图提供帮助! :)

@user3210641,感谢您完成完整的问题! :)

@Arun Bhat,欢迎来到堆栈溢出!感谢您提交答案!

var input = document.getElementById('myInput');
input.onkeydown = function() {
var key = event.keyCode || event.charCode;
if( key == 8 || key == 46 )
return false;
};
<input id="myInput" type="text" name="firstname" value="Mickey">

请查看上面的代码,它检测密钥并通过返回错误onkeydown取消操作

我认为不应该将以前的答案标记为正确,因为您可以通过粘贴新文本或突出显示文本的某些部分并键入来更改输入字段的内容。

这是一个完整的解决方案:

let content = '';
document.getElementById('input').addEventListener('input', function(e) {
const value = this.value;

if (this.value.length > content.length && value.indexOf(content) === 0) {
content = value;
return;
}

this.value = content;
});
<input id="input" />

说明:每次输入值更改时,它都会检查更新的输入值是否比前一个输入值长(已添加字符(,以及它是否包含前一个输入值的所有字符 - 如果是,它会添加新字符并更新内容变量,否则将输入值设置为前一个。

以下函数阻止用户deletecutpaste输入框值:

$( '#txt' ).on( 'keydown', function( e ) {
var key = e.keyCode || e.charCode;
if ( key == 8 || key == 46 ) e.preventDefault();
} ).on( 'cut paste', function( e ) {
e.preventDefault()
} )
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="txt" type="text" placeholder="Enter Text">

下面的代码应该可以工作。

function noBackSpace()
{
if(event.keyCode == 8 || event.keyCode == 46)
{
alert("No Back Space");
return false;
}
}
<input type="text" name="txt" value="" onkeydown="return noBackSpace()">

最新更新