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

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

노력했습니다.

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

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

});

그러나 문자를 입력한 후 입력한 텍스트를 약간 제거합니다.사용자가 텍스트 필드를 비활성화하지 않고 텍스트를 완전히 입력하지 못하도록 하는 방법이 있습니까?

쉽게 간과할 수 있는 자바스크립트가 아닌 대안: 사용할 수 있습니까?readonly대신 속성disabled속성?이렇게 하면 입력의 텍스트를 편집할 수 없지만 브라우저는 입력 스타일을 다르게 설정합니다(예: "회색 처리"할 가능성이 낮습니다).<input readonly type="text" ...>

필드를 "사용 안 함" 또는 smth로 표시하지 않으려면 다음을 사용합니다.

onkeydown="return false;"

기본적으로 그린짓과 데릭이 말한 것과 같지만 조금 더 짧습니다.

$('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입력이 해당 사용자를 무시하도록 하여 사용자가 값을 변경하거나 영향을 주지 않도록 합니다.

필요에 따라 사용할 수 있는 다른 방법$('input').onfocus(function(){this.blur()});이렇게 쓰시면 될 것 같아요.저는 질문에 능숙하지 않습니다.

CSS 전용 솔루션의 경우 설정해 보십시오.pointer-events: none인풋으로

마크업

<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의 OR:

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

AND를 CSS 이하에 추가:

.readonly {
  pointer-events: none;
}

이 솔루션의 좋은 점은 함수에서 동적으로 설정 및 해제할 수 있으므로 생성 시 D3과(예: 단일 "읽기 전용" 특성으로는 불가능) 통합할 수 있다는 것입니다.

클래스에서 요소를 제거하려면:

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

또는 Jquery를 사용합니다.

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

또는 클래스 전환:

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

그냥 완벽하게, 행운을 빌어요 =^)

아래와 같이 onkeydown="return false"를 제어 태그에 사용하면 사용자로부터 값을 받지 않습니다.

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

한 가지 옵션은 핸들러를input사건의

이 접근 방식의 장점은 사용자가 예상하는 키보드 동작(예: 탭, 페이지 위/아래 등)을 방지하지 않는다는 것입니다.

상황에 맞는 메뉴를 통해 텍스트를 붙여 입력값이 변경될 때도 처리할 수 있다는 점도 장점입니다.

이 방법은 입력을 비워 두는 것에만 관심이 있는 경우에 가장 효과적입니다.값을 에서?)에서해야 합니다.은 특값 곳데다른서속에성면려유이하지터정을?)에서 할 수 입니다.에서 추적해야 합니다. 이는 다음 시간에 사용할 수 없기 때문입니다.input이벤트가 수신되었습니다.

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

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

<input type="text" />

Safari 10, Firefox 49, Chrome 54, IE 11에서 테스트되었습니다.

가장 좋은 해결책은 사용자가 입력을 클릭하면 포커스를 해제하여 읽기 전용으로 만드는 것입니다.

  onFocus={e => e.target.blur()}

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