필드를 비활성화하지 않고 사용자가 텍스트 필드에 입력하는 것을 방지하는 방법은 무엇입니까?

필드를 비활성화하지 않고 사용자가 텍스트 필드에 입력하는 것을 방지하는 방법은 무엇입니까?

---

나는 시도했다 :

$('input').keyup(function() {

   $(this).attr('val', '');

});

그러나 문자를 입력 한 후 입력 된 텍스트를 약간 제거합니다. 어쨌든 사용자가 텍스트 필드를 비활성화하지 않고 텍스트를 완전히 입력하지 못하게 할 수 있습니까?

---

쉽게 간과 될 수있는 비 자바 스크립트 대안 : readonly속성 대신 속성 을 사용할 수 disabled있습니까? 입력의 텍스트를 편집하는 것을 방지하지만 브라우저는 입력의 스타일을 다르게 지정합니다 ( "회색으로 표시"할 가능성이 낮음).<input readonly type="text" ...>

---

필드가 "비활성화 됨"또는 약간만 보이게하지 않으려면 다음을 사용하십시오.

onkeydown="return false;"

기본적으로 greengit과 Derek이 말한 것과 동일하지만 조금 더 짧습니다.

---

$('input').keydown(function(e) {
   e.preventDefault();
   return false;
});

---

$('input').keypress(function(e) {
    e.preventDefault();
});

---

사용자가 아무것도 추가하지 못하도록하고 문자를 지울 수있는 기능을 제공 하려는 경우 :

<input value="CAN'T ADD TO THIS" maxlength="0" />

maxlength입력 의 속성을로 설정하면 "0"사용자가 콘텐츠를 추가 할 수 없지만 원하는대로 콘텐츠를 지울 수 있습니다 .

---

그러나 진정으로 일정하고 변경할 수 없도록하려면 :

<input value="THIS IS READONLY" onkeydown="return false" />

onkeydown속성을로 설정하면 return false입력이 사용자 keypresses를 무시 하도록하여 값이 변경되거나 영향을받지 않도록합니다.

---

필요에 따라 사용할 수있는 다른 방법 중 하나 $('input').onfocus(function(){this.blur()});는 이것이 당신이 작성하는 방법이라고 생각합니다. 나는 jquery에 능숙하지 않습니다.

---

마크 업

<asp:TextBox ID="txtDateOfBirth" runat="server" onkeydown="javascript:preventInput(event);" onpaste="return false;"
                                TabIndex="1">

스크립트

function preventInput(evnt) {
//Checked In IE9,Chrome,FireFox
if (evnt.which != 9) evnt.preventDefault();}

---

추가가 불가능한 D3와 같은 동적 자바 스크립트 DOM 생성과 함께 작동하는 것을 추가하고 싶습니다.

//.attr(function(){if(condition){"readonly"]else{""}) //INCORRECT CODE !

HTML 입력 DOM 요소에 대한 작업을 방지하려면 클래스에 읽기 전용을 추가합니다.

var d = document.getElementById("div1");
d.className += " readonly";

또는 D3에서 :

 .classed("readonly", function(){
   if(condition){return true}else{return false}
 })

그리고 CSS 이하에 추가 :

.readonly {
  pointer-events: none;
}

the nice thing about this solution is that you can dynamically turn it on and of in a function so it can be integrated in for example D3 at creation time (not possible with the single "readonly" attribute).

to remove the element from class:

document.getElementById("MyID").className =
  document.getElementById("MyID").className.replace(/\breadonly\b/,'');

or use Jquery:

$( "div" ).removeClass( "readonly" )

or toggle the class:

$( "div" ).toggleClass( "readonly", addOrRemove );

Just to be complete, good luck =^)

---

just use onkeydown="return false" to the control tag like shown below, it will not accept values from user.

    <asp:TextBox ID="txtDate" runat="server" AutoPostBack="True"
ontextchanged="txtDate_TextChanged" onkeydown="return false" >
    </asp:TextBox>

---

if the text shows up before keyup, then it's probably triggered in keydown event. Did you try that one yet?

---

One option is to bind a handler to the input event.

The advantage of this approach is that we don't prevent keyboard behaviors that the user expects (e.g. tab, page up/down, etc.).

Another advantage is that it also handles the case when the input value is changed by pasting text through the context menu.

This approach works best if you only care about keeping the input empty. If you want to maintain a specific value, you'll have to track that somewhere else (in a data attribute?) since it will not be available when the input event is received.

const inputEl = document.querySelector('input');

inputEl.addEventListener('input', (event) => {
  event.target.value = '';
});

<input type="text" />

Tested in Safari 10, Firefox 49, Chrome 54, IE 11.

참고URL : https://stackoverflow.com/questions/6951658/how-to-prevent-user-from-typing-in-text-field-without-disabling-the-field