我正在嘗試使用 javascript 上傳影像并將其顯示在 div 中，但我現在使用的方法不起作用。我嘗試同時使用 img 標簽并將其設定為背景影像，但兩者都不會在 div 中顯示 img，但是當我檢查 div 時，它顯示 URL 已成功插入。我哪里做錯了？任何幫助表示贊賞。提前致謝。
const image_input = document.querySelector("#image_input");
image_input.addEventListener("change", function() {
const reader = new FileReader();
reader.addEventListener("load", () => {
const uploaded_image = reader.result;
$('.imgCon').attr("background-image", `url(${uploaded_image})`);
$('.imgCon2 img').attr("src", `url(${uploaded_image})`);
});
reader.readAsDataURL(this.files[0]);
});.imgCon {
position: absolute;
top: 30%;
width: 40%;
height: 40%;
border-radius: 8px;
background-color: #000000;
/* background-size: 100%; */
background-position: center;
background-size: cover;
}
.imgCon2 {
position: absolute;
top: 30%;
right: 0%;
width: 40%;
height: 40%;
border-radius: 8px;
background-color: #000000;
/* background-size: 100%; */
background-position: center;
background-size: cover;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="file" title="" id="image_input" accept="image/png, image/jpg">
<div class="imgCon">
</div>
<div class="imgCon2">
<img src="" />
</div>uj5u.com熱心網友回復：
改成：
$('.imgCon').css("background-image", `url(${uploaded_image})`);
$('.imgCon2 img').attr("src", uploaded_image);
attr將在元素上設定一個屬性，即<div background-image="url(...)"不src="url(...)"正確。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/427827.html
標籤：javascript jQuery css