이 질문에는 출처와 함께 최신 답변이 필요했습니다. 이것은 실제로 작동하는 것입니다 (단, 내 말을 할 필요는 없지만).

// Storing this jQuery object outside of the event callback 
// prevents jQuery from having to search the DOM for it again
// every time an event is fired.
var $myButton = $("#buttonID")

// input           :: for all modern browsers [1]
// selectionchange :: for IE9 [2]
// propertychange  :: for <IE9 [3]
$('#textareaID').on('input selectionchange propertychange', function() {

  // This is the correct way to enable/disabled a button in jQuery [4]
  $myButton.prop('disabled', this.value.length === 0)

}

1 : https://developer.mozilla.org/en-US/docs/Web/Events/input#Browser_compatibility
2 : BACKSPACE / DEL을 수행 할 때 IE9의 oninput이 실행되지 않음
3 : CUT 3 : https : // msdn .microsoft.com / en-us / library / ms536956 (v = vs.85) .aspx
4 : http://api.jquery.com/prop/#prop-propertyName-function

그러나 프로젝트 전체에서 사용할 수있는보다 글로벌 한 솔루션을 위해 textchange jQuery 플러그인 을 사용 하여 브라우저 간 호환되는 새로운 textchange이벤트 를 얻는 것이 좋습니다 . 페이스 북의 ReactJS에 해당하는 이벤트를 구현 한 동일한 사람 이 개발했으며 ,onChange 거의 전체 웹 사이트에 사용합니다. 그리고 그것이 페이스 북을위한 충분한 솔루션이라면, 아마도 당신에게 충분히 강력 할 것입니다. 🙂

업데이트 : Internet Explorer에서 끌어서 놓기 지원과 같은 기능이 필요한 경우 대신 pandell최신 업데이트 포크jquery-splendid-textchange 를 확인하십시오 .

답변

let textareaID = document.getElementById('textareaID');
let yourBtnID = document.getElementById('yourBtnID');
textareaID.addEventListener('input', function() {
    yourBtnID.style.display = 'none';
    if (textareaID.value.length) {
        yourBtnID.style.display = 'inline-block';
    }
});

<textarea id="textareaID"></textarea>
<button id="yourBtnID" style="display: none;">click me</div>

$('#textareaID').on('input change keyup', function () {
  if (this.value.length) {
    // textarea has content
  } else {
    // textarea is empty
  }
});

$("textarea").focusout(function() {
   alert('textarea focusout');
});