我有一个文本框,它包含一个值“Given Name”。我想禁用文本框的第一个字符,以便用户无法使用退格键或任何其他方法更改文本框中的First Charcter。 例如:假设文本框包含值“Given Name”。我希望用户不能使用退格或任何其他方式更改第一个字符“G”。
<input type="text" id="nameId" onkeydown="validate(this.val)"/>
下面是javscript函数:
function validate2(val) {
// have no idea how to do.
}
我不知道如何在Javscript或Jquery中这样做。
答案 0 :(得分:2)
你可以这样做:
$("#nameId").on("keydown", function(e) {
// if user writes a char at index === 0 that is not an arrow or HOME or END
if (($(this).get(0).selectionStart === 0 && (e.keyCode < 35 || e.keyCode > 40))
// or if user tries to erase first char
|| ($(this).get(0).selectionStart === 1 && $(this).get(0).selectionEnd === 1 && e.keyCode === 8)) {
// don't write the character
return false;
}
});
// prevent right click
$("#nameId").bind("contextmenu", function(e) {
e.preventDefault();
});
<强> JSFIDDLE 强>
答案 1 :(得分:1)
不打算回答,留下评论,但在看到其他答案后,我认为我可能会快速回答:
html:
<input type="text" id="nameId" value="Given Name" onkeydown="save(this,event)" onkeyup="restore(this,event)" onchange="restore(this,event)"/>
javascript:
function restore(el,event) {
if(el.value.length == 0){
el.value = el.dataset.value.substr(0,1);
}else{
el.dataset.value = el.value;
}
}
function save(el,event) {
var key = event.which || event.charCode || event.keyCode;
if((key === 8 && el.value.length === 1)
|| (key === 46 && el.selectionStart == 0 && el.value.length === 1)){
event.preventDefault();
}
if(el.value.length > 0){
el.dataset.value = el.value;
}
}
方法是不要过多地防止删除实际角色(只是非常简单的基础),而是确保如果有人删除第一个角色以便总是以某种方式恢复它。它创建的代码易于理解和维护,但工作得非常整齐。也可以找到一个小提琴here。 请注意以一种应该工作的方式编辑它跨浏览器,包括旧浏览器。event.which
并不是最常见的浏览器一致界面,所以要么使用jQuery,要么在生产中使用它之前检查其他浏览器。
答案 2 :(得分:0)
你可以试试这个: -
<input type="text" id="nameId" value="Given Name" onkeydown="validate(this.value,event)"/>
<script>
function validate(val,event) {
// have no idea how to do.
if(event.target.selectionStart != undefined && (event.which === 46 ||event.which === 8)){
var startPos = event.target.selectionStart,
endPos = event.target.selectionEnd;
console.log(startPos,endPos);
if(startPos === 0 && startPos != endPos){
var restPart = val.slice(endPos,val.length);
if(restPart){
val = val[0].concat(restPart);
} else{
val = val[0]
}
event.target.value = val;
event.preventDefault();
} else if(startPos === 0 && startPos === endPos && event.which === 46){
event.preventDefault();
} else if(startPos === 1 && event.which === 8){
event.preventDefault();
}
}
}
</script>
答案 3 :(得分:0)
这是我的版本。
<强> HTML 强>
<input type="text" id="nameId" value="Given Name" />
<强> JS 强>
var lastentry = '';
$("#nameId").on("keyup", function(e) {
var targetValue = $(e.currentTarget).attr('value');
var targetValueLength = targetValue.length;
var inputValue = this.value;
if(checkChanges(targetValueLength, targetValue, inputValue))
this.value = targetValue + lastentry;
else
lastentry = this.value.slice(targetValueLength)
});
function checkChanges(targetValueLength, targetValue, inputValue)
{
for(var i = 0; i < targetValueLength ; i++)
{
if(targetValue[i] != inputValue[i])
return true;
}
return false;
}
答案 4 :(得分:-2)
嗨使用它,它不允许删除第一个字符,
$(document).keydown(function(e)
{
var value = $('#nameId').val().length;
if ( e.keyCode == 8 && value < 2)
e.preventDefault();
});