백스페이스를 감지하고 "입력" 이벤트를 지연하시겠습니까?

백스페이스를 감지하고 "입력" 이벤트를 지연하시겠습니까?

어떻게 하는 거지?

노력했습니다.

var key = event.which || event.keyCode || event.charCode;

if(key == 8) alert('backspace');

하지만 효과가 없어요

키 누르기 이벤트에서 동일한 작업을 수행하면 작동하지만 입력 필드에 입력한 문자가 출력되므로 키 누르기를 사용하고 싶지 않습니다.나는 그것을 통제할 수 있어야 합니다.

---

내 코드:

  $('#content').bind('input', function(event){

    var text = $(this).val(),
        key = event.which || event.keyCode || event.charCode;

    if(key == 8){
      // here I want to ignore backspace and del
    }

    // here I'm doing my stuff
    var new_text = 'bla bla'+text;
    $(this).val(new_text);
  });

내 입력에 문자를 추가해서는 안 되며, val()로 추가하는 것 외에 실제로 사용자의 입력은 완전히 무시되어야 하며, 키 누르기 작업만 중요합니다.

사용하다.onkeydown제거를 취소합니다.return false;. 다음과 같은 경우:

var input = document.getElementById('myInput');

input.onkeydown = function() {
    var key = event.keyCode || event.charCode;

    if( key == 8 || key == 46 )
        return false;
};

---

또는 jQuery의 경우, 질문에 jQuery 태그를 추가했기 때문에:

jQuery(function($) {
  var input = $('#myInput');
  input.on('keydown', function() {
    var key = event.keyCode || event.charCode;

    if( key == 8 || key == 46 )
        return false;
  });
});

​

event.key === "백스페이스"

보다 최신의 훨씬 깨끗한 제품: 사용event.key. 더 이상 임의의 숫자 코드는 없습니다!

input.addEventListener('keydown', function(event) {
    const key = event.key; // const {key} = event; ES6+
    if (key === "Backspace" || key === "Delete") {
        return false;
    }
});

모질라 문서

지원되는 브라우저

위드제이쿼리

이벤트.이벤트를 정규화하는 속성입니다.keyCode and event.charCode.이벤트 관람을 권장합니다.키보드 키 입력에 사용할 수 있습니다.

http://api.jquery.com/event.which/

jQuery('#input').on('keydown', function(e) {
    if( e.which == 8 || e.which == 46 ) return false;
});

오래된 질문이지만 키다운, 키누름 또는 키업이 아닌 입력 시 백스페이스 이벤트를 캡처하려면 inputType을 사용하여 백스페이스를 캡처할 수 있습니다.

document.getElementsByTagName('input')[0].addEventListener('input', function(e) {
    if (e.inputType == "deleteContentBackward") {
        // your code here
    }
});

keydown와 함께event.key === "Backspace" or "Delete"

보다 최신의 훨씬 깨끗한 제품: 사용event.key. 더 이상 임의의 숫자 코드는 없습니다!

input.addEventListener('keydown', function(event) {
    const key = event.key; // const {key} = event; ES6+
    if (key === "Backspace" || key === "Delete") {
        return false;
    }
});

모던 스타일:

input.addEventListener('keydown', ({key}) => {
    if (["Backspace", "Delete"].includes(key)) {
        return false
    }
})

모질라 문서

지원되는 브라우저

'on keydown'을 사용해 보셨나요?이것이 당신이 찾고 있는 이벤트입니다.

입력 전에 동작하며 문자 입력을 취소할 수 있습니다.

$('div[contenteditable]').keydown(function(e) {
// trap the return key being pressed
if (e.keyCode === 13 || e.keyCode === 8)
{
    return false;
}
});

크롬을 사용하는 안드로이드 기기에서는 백스페이스를 감지할 수 없습니다.다음과 같은 해결 방법을 사용할 수 있습니다.

var oldInput = '',
    newInput = '';

 $("#ID").keyup(function () {
  newInput = $('#ID').val();
   if(newInput.length < oldInput.length){
      //backspace pressed
   }
   oldInput = newInput;
 })

InputEvent.inputType백스페이스 탐지 Mozilla Docs에 사용할 수 있습니다.크롬 데스크톱, 크롬 안드로이드, 사파리 iOS에서 작동합니다.

<input type="text" id="test" />

<script>  
  document.getElementById("test").addEventListener('input', (event) => {
  console.log(event.inputType);
  // Typing of any character event.inputType = 'insertText'
  // Backspace button event.inputType = 'deleteContentBackward'
  // Delete button event.inputType = 'deleteContentForward'
  })
</script>

//Here's one example, not sure what your application is but here is a relevant and likely application 
function addDashesOnKeyUp()
{
    var tb = document.getElementById("tb1"); 
    var key = event.which || event.keyCode || event.charCode;

    if((tb.value.length ==3 || tb.value.length ==7 )&& (key !=8) ) 
    {
        tb.value += "-"
    } 
}

라이브 데모

Javascript
<br>
<input id="input">
<br>
or
<br>
jquery
<br>
<input id="inpu">

<script type="text/javascript">
var myinput = document.getElementById('input');
input.onkeydown = function() {
  if (event.keyCode == 8) {
    alert('you pressed backspace');
    //event.preventDefault(); remove // to prevent backspace
  }

  if (event.keyCode == 46) {
    alert('you pressed delete');
    //event.preventDefault(); remove // to prevent delete
  }
};

//jquery code

$('#inpu').on('keydown', function(e) {
  if (event.which == 8) {
    alert('you pressed backspace');
    //event.preventDefault(); remove // to prevent backspace
  }

  if (event.which == 46) {
    alert('you pressed delete');
    //event.preventDefault(); remove // to prevent delete
  }
});
</script>

언급URL : https://stackoverflow.com/questions/9906885/detect-backspace-and-del-on-input-event