<input type =「file」>與document.value（）不起作用。

我試着讓用戶上傳圖片，並在圖片上傳完成，可以點擊添加圖片按鈕，它會添加到文本框作爲IMG SRC。雖然，它與[對象HTMLInputElement]返回類似於null，爲什麼會發生這種情況？<input type =「file」>與document.value（）不起作用。

function added() { 
    var image = document.getElementById('fileToUpload'); 
    document.getElementById('media_post').value = '<img src="http://lit.life/gallry/<?php echo $dir_auth1; ?>/uploads/">' + image; 
} 

<form action="upload1.php" method="post" id="addedImage" enctype="multipart/form-data" data-ajax="false"> 
Select image to upload: 
<input type="file" name="fileToUpload" id="fileToUpload"> 
<input type="submit" value="Upload Image" name="submit">

<textarea rows="4" cols="45" id="media_post" name="media_post" form="usr_post" maxlength="300" method="get"> 

</textarea>

來源

2016-02-12 aidangig

你已經在你的例子提供的代碼似乎劑量不多大意義。 JS不應該在腳本標記中？ –

@DanWalker yup。它是。雖然，它實際上是在我的腳本中，只是沒有在StackOverFlow – aidangig

你想顯示的<input>元素，而不是它的價值。

var image = document.getElementById('fileToUpload').value;

如果你想這個文件名，成爲圖像URL的一部分，你需要把它src屬性中。

document.getElementById('media_post').value = '<img src="http://lit.life/gallry/<?php echo $dir_auth1; ?>/uploads/' + image + '">' ;

function added() { 
 
    var image = document.getElementById('fileToUpload').value; 
 
    document.getElementById('media_post').value = '<img src="http://lit.life/gallry/aidan/uploads/' + image + '">' ; 
 
}

Select image to upload: 
 
<input type="file" name="fileToUpload" id="fileToUpload" onchange="added()"> 
 
<input type="submit" value="Upload Image" name="submit"> 
 

 
<br>Preview 
 
<br> 
 
<textarea rows="4" cols="45" id="media_post" name="media_post" form="usr_post" maxlength="300" method="get"> 
 

 
</textarea>

來源

2016-02-12 01:00:54 Barmar

好吧，那麼除了'.value'之外，我可以改變它，這對那些信息來說真的很好。 – aidangig

'.value'將是'input'的文件名。你想讓它在圖像旁顯示什麼？ – Barmar

是的，這是我試圖做的。把這個文件名輸入到一個'img src'文本框中。 ' [對象HTMLInputElement]' 有何幫助？ – aidangig

<input type =「file」>與document.value（）不起作用。

回答

相關問題