當我點擊它時,我需要放大一張圖片。問題是我在我的 javascript 中從我的資料庫中獲取了這張圖片,我不知道如何在點擊后更改圖片的大小
這是使用資料創建圖片的js函式
function loadSynthese(data) {
$.ajax({
cache: false,
url: "data/loadSynthese",
type: "POST",
async: true,
data: ({
dateid: data,
}),
success: function (response, status) {
response.forEach(element => {
css = "";
idonglet = element["id_onglet"];
idprio = element["id_prio"];
texte = element["texte"];
image = element["image_aide"];
if(image === '' || image === null || image === undefined){
htmlPrio = '<div ><p >Priorité ' k '' pilote '</p><img id="' idonglet 'imgCheck' idprio '" onclick="selectPrioSynth(' idonglet ', ' idprio ', this)" ' css ' alt="未捕獲的型別錯誤:無法讀取未定義的屬性(讀取“”)" data-idprio="' idprio '"></div><label onclick="selectPrioSynth(' idonglet ', ' idprio ', this)" data-idprio="' idprio '">' texte '</label>';
} else {
img = '</br><img id="image' idprio '" src="data:image/jpeg;base64,' btoa(image) '">';
htmlPrio = '<div ><p >Priorité ' k '' pilote '</p><img id="' idonglet 'imgCheck' idprio '" onclick="selectPrioSynth(' idonglet ', ' idprio ', this)" ' css ' alt="未捕獲的型別錯誤:無法讀取未定義的屬性(讀取“”)" data-idprio="' idprio '"></div><label onclick="selectPrioSynth(' idonglet ', ' idprio ', this)" data-idprio="' idprio '">' texte '<p onclick="enlargeImg()">' img '</p></label>';
}
$("#" idonglet "ps").append(htmlPrio);
((nextid == idonglet) ? k : k = 1);
j ; i ;
((j < response.length - 1) ? nextid = response[i]['id_onglet'] : "");
});
}
},
error: function (response, status) {
}
});}
在這里我想添加他的功能來改變圖片的大小
function enlargeImg(img) {
img.style.width = "60%";
img.style.height = "auto";
img.style.transition = "width 0.5s ease";}
當我點擊圖片時,我遇到了這個問題:“Uncaught TypeError: Cannot read properties of undefined (reading 'style')”
uj5u.com熱心網友回復:
您可以添加或洗掉一個 css 類some-name
,transform:scale(1.5)
而您的 img 有transition: 0.5s
img {
transition: 0.5s;
}
img:hover,
.some-class {
transform: scale(1.5)
}
<img src="https://picsum.photos/200" style="margin:40px">
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/504887.html
標籤:javascript php html dom
上一篇:用正則運算式匹配一組特定的字串
下一篇:動態深化物件內部