2016-05-13 138 views
0

我有一個表格,我要上傳的文件,但我得要上傳的文件,但我不能這樣做,因爲我得到這個錯誤未捕獲的類型錯誤

main.js:5 Uncaught TypeError: Cannot read property 'value' of null

function upload() { 
    var data = new XMLHttpRequest(); 
    var url = "includes/upload.php"; 
    var file = document.getElementById("filename").value; 
    var image = document.getElementById("image").value; 
    var span = document.querySelector('#uploadPreview[style]'), 
     a = window.getComputedStyle(span, null).transform, 
     b = window.getComputedStyle(span, null).transformOrigin; 
    val = 'transform:' + a + ';transform-origin:' + b + ';backface-visibility: hidden;'; 

    var vars = "style=" + val + "&image=" + image + "&filename=" + file; 

    data.open("POST", url, true); 
    data.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    data.onreadystatechange = function() { 
     if (data.readyState == 4 && data.status == 200) { 
      var return_data = data.responseText; 
      document.getElementById("comment_box").innerHTML = return_data; 
     } 
    } 

    data.send(vars); 
} 

我的HTML代碼:

<form method="POST" enctype="multipart/form-data" style="text-align:center;"> 
    <input id="uploadImage" type="file" id="image" name="image" style="margin:auto;" /> 
    <input type="hidden" id="x" name="x" /> 
    <input type="hidden" id="y" name="y" /> 
    <input type="hidden" id="w" name="w" /> 
    <input type="hidden" id="h" name="h" /> 
    <input type="hidden" id="filename" name="filename" value="<?php if(!empty($data['profile_pic'])) { echo $data['profile_pic'];} ?>" /> 
    <button type="button" name="update_picture" class="btn_form" onclick="upload();">Update Picture</button> 
</form> 
+0

你的main.js腳本中的劑量線71包含什麼?如果可能請提供JSFiddle。 –

+0

var image = document.getElementById(「uploadImage」)。value; –

+0

其實我只是注意到在你的html中有一個重複的id,你不能這樣做 –

回答

0

你有2點ID的位置:

<input id="uploadImage" type="file" id="image" name="image" style="margin:auto;" /> 

嘗試僅使用一個ID。

你不能都有,你可以參考這個問題here