잡히지 않은 TypeError : 요소의 null의 속성 'files'을 읽을 수 없습니다.

Question

채팅이있는 작은 웹 사이트를 만들고 있습니다. 현재는 문자 메시지 만 보낼 수 있으며 파일 전송자를 열어 이미지, 비디오, GIF를 보내려했습니다.

나는 길을 따라 몇 가지 문제를 겪었지만 다른 사람들의 도움없이 모든 것을 얻었습니다. 그러나 나는 지금 그것을 아주 필요로하고있다.

FormData, Ajax 및 jQuery를 사용하여 클라이언트에서 PHP 서버로 전송되는 실시간 이미지를 가질 수 있습니다. 내가 직면하고 문제는 :

Uncaught TypeError: Cannot read property 'files' of null

formData에 파일을 추가하려고합니다. 보세요 :

function opencraze() { 
    $(".browse_send_file").change(function() { 
     var chat_id = "123"; 
     var formData = new FormData(); 

     formData.append("chat_id", chat_id); 

     var name = document.getElementById('#browse_' + chat_id); 
     var filemsg = name.files[0]; 
     formData.append("userfile", filemsg); 
    }); 
} 

html로 : 모든 전에 어떻게됩니까

<div class="chat_wcom" style="width: 25%;"> 
    <label for="browse_123" class="material-icons"></label> 
    <input type="file" class="browse_send_file" id="browse_123" name="browse_send_file" style="display: none"> 
    <input maxlength="140" type="text" id="input_123" class="comin" placeholder="My message..." name="sendmsg" onkeypress="g(event,123)" autocapitalize="off" autocorrect="off" style="width: auto;"> 
    <input class="hidden_index" type="text" value="123" name="chat_index"> 
</div> 

는 사용자가 div를 클릭 할 때, 위의이 HTML이 생성됩니다이며이 생성되면, 그것은 opencraze()를 호출 기능. 이제는 채팅 레이블을 누르면 파일이 선택되고 .change() jQuery 함수가 활성화됩니다. 오류는 다음 줄에 있습니다.

var filemsg = name.files[0]; 

도움이 되셨습니까? 감사합니다.

Answer 1

네이티브 javacript document.getElementById()은 'id'를 jQuery 선택기 #없이 문자열로 예상합니다.
는 그래서 # 제거 :

var name = document.getElementById('browse_'+chat_id); 

을 또는 jQuery selector 방법을 사용

이

var name=$('#browse_'+chat_id);