div에 Ajax 응답 채우기 문제

Question

무엇이 누락 되었습니까? ID로 get 요소를 추가했고 확실히 응답을 얻었습니다. 파이어 버그를 사용하여 검사했으며 응답이 정확합니다. 하지만 왜 내 div 영역을 채우지 않을 알아낼 수 없습니다.

<script> 
$(document).ready(function() { 
    $("#cmdSend").click(function() { 
     // Get he content from the input box 
     var mydata = document.getElementById("cmdInput").value; 
     $.ajax({ 
      type: "POST", 
      url: "/Terminal/processCommand", 
      data: { cmd: mydata }, // pass the data to the method in the Terminal Contoller 
      success: function (data) { 
       //alert(data); 
       // we need to update the elements on the page 
       document.getElementById("terminal").value = document.getElementById("terminal").value + mydata; 
       document.getElementById("terminal").value = document.getElementById("terminal").value + data; 
      }, 
      error: function (e) { alert(e); } 
     }) 
    }); 
}); 
</script> 

그리고 사업부 나는 응답에 넣어 싶지 :

<div class="terminal" style="overflow:scroll"> 
<br> 
</div> 

Answer 1

먼저 document.getElementById()를 호출하지만 div에 터미널 ID가 없으면 터미널이라는 클래스가 있습니다.

둘째, jQuery를 사용하지만 기본 자바 스크립트로 다시 전환합니다. 다음에 코드를 업데이트 할 수 다음 $(".SomeName") 선택이 클래스 선택을위한 것이며 $("#SomeName")이 ID로 선택하는 것입니다

success: function (data) { 
    //alert(data); 
    // we need to update the elements on the page 
    var existingHtml = $(".terminal").html(); 
    $(".terminal").html(existingHtml + mydata + data); 
} 

참고.

편집이 터미널 사업부는 내부에 많은 데이터를 얻을 시작할 수 있다면

을 참고, 당신은 HTML의 복사본을 만들 필요 방지하기 위해 jQuery를에 .append() 기능을 사용하여 볼 수 있으며, 요청이있을 때마다 HTML을 덮어 씁니다. 이 업데이트는 (은 조금 더 짧고 더 효율적뿐만 아니라이어야 함)는이 jQuery를 사용하지 사업부의 주장 변경하려면

success: function (data) { 
    //alert(data); 
    // we need to update the elements on the pag 
    $(".terminal").append(mydata + data); 
} 

Answer 2

당신이 id로 당신의 요소를 얻을 DIV에 ID를 추가하려면 :

<div id=terminal class="terminal" style="overflow:scroll"> 
<br> 
</div> 

Answer 3

, 대신 값의 innerHTML을 사용해야합니다 다음과 유사한 것이다.

document.getElementById("divID").innerHTML = document.getElementById("divID").innerHTML + data