onKeyUp에 이벤트가 텍스트 영역

작동하지 I는 HTML에서 매우 기본적인 input/output 구조를 가지고onKeyUp에 이벤트가 텍스트 영역

<textarea id="input" onkeyup="sendCode()"> 
Hello World! 
</textarea> 

<div id="output"></div>

및 I는 입력에서 출력 모두를 통과해야 JS 함수 가지고

var input = document.getElementById("input"); 
var output = document.getElementById("output"); 

function sendCode(){ 
output.innerHTML = input.innerHTML; 
}

sendCode() 함수 수동으로 호출 할 때 작동하지만이 텍스트 영역에 onkeyup 이벤트가 발생하지 않는 것으로 보입니다. http://jsfiddle.net/mudroljub/y5a2n8ab/

어떤 도움 : 여기

는 jsfiddle입니까?

업데이트 : jsfiddle가 업데이트되어 작동 중입니다. 이 콘텐츠 텍스트하지만 값 속성

var input = document.getElementById("input"); 
var output = document.getElementById("output"); 

function sendCode(){ 
output.innerHTML = input.value; 
}

그리고 당신이 sendCode() 함수를 정의 할 demo here

출처

2014-09-22 Damjan Pavlica

사용 가치인가? 텍스트 영역을 만들 때 존재하지 않을 수도 있습니다.

이 조각은 작동합니다 :

<textarea id="editor"> 
    Hello World! 
</textarea> 
<div id="output"></div> 
<script type="text/javascript"> 
    var editor = document.getElementById("editor"); 
    var output = document.getElementById("output"); 

    function sendCode(){ 
    output.innerHTML = editor.value; 
    } 
    editor.addEventListener('keyup',sendCode); 
</script>

출처

2014-09-22 14:32:11 andrex

고마워, 너는 내 문제를 아주 빨리 해결해. –

@DamanDaman 가장 좋은 답변 인 경우 다른 사람들에게 np – andrex

작동하지 이후

출처

2014-09-22 14:43:13 Tom

감사 인사를 알리기 위해 허용으로 표시 할 수 있습니다.이 방법도 좋습니다. –

내가 처음이는 HTML이 존재하기 전에 코드가 실행되기 때문에, 그래서 첫째, 실행 함수 내에서이 라인을 넣어하지 않을 것이라는 점을 지적하고 싶습니다

둘째

window.onload= function anyname() { 
var input = document.getElementById("input"); 
var output = document.getElementById("output"); 
}

사용하여 시도 중 하나 스크립트 영역 또는 t에서

editor.onkeyup = "sendCode()"

새로운 기능의 영업 이익은 내가 만든 : 키가 그 지역에 갈 때

editor.addEventListener(keyup,sendCode,false)

은 기본적으로는 sendCode() 함수를 호출합니다. 거짓이라면 어쨌든 디폴트라고 생각되는 캡쳐를 사용하고 싶지 않고 단지 안전하기 만하면됩니다.

출처

2014-09-22 14:44:04 Brendan

기본적으로 자바 스크립트는 동적이지 않습니다. 더 나은 옵션은 jQuery를 사용하는 것입니다.

[참고 : - "JQuery와-2.2.2.min.js는" JQuery와 라이브러리 파일의 코드는 다음 링크에서 복사 할 수있다, 스크립트 태그에, SRC에 주어진 : http://code.jquery.com/jquery-2.2.2.min.js]

그냥에서 내용을 복사 위의 링크를 텍스트 파일로 복사 한 다음 "jquery-2.2.2.min.js" 또는 원하는 다른 이름으로 저장하십시오. 스크립트의 src에는 동일한 내용이 포함되어야합니다. "jquery-2.2.2.min.js"는 과 같은 디렉토리에 있어야합니다. html 파일이 있습니다. 그렇지 않으면 언급 할 전체 경로.

여기에 귀하의 질문에 대한 답변이 나와 있습니다.

<html> 
    <head> 
     <title>Dynamic TextArea</title> 
     <script type="text/javascript" src="jquery-2.2.2.min.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
        $("textarea").keyup(function(){ 
          sendCode(); 
        }); 
      }); 

      function sendCode(){ 
        document.getElementById("output").innerHTML = 
        document.getElementById("input").value; 
      } 
     </script> 
    </head> 
    <body> 
     <form> 
       <textarea id="input"> 
         Hello World! 
       </textarea> 
     </form> 
     <span id="output"></span> 
    </body> 
    </html>

의심되는 점이 있으면 문의하십시오. 일단 jQuery를 사용하면 자바 스크립트를 잊어 버릴 것을 배웠습니다.

출처

2016-03-26 16:45:48 Anupam

답변

관련 문제