怎樣的OnClick功能結合到圖像的列表在Javascript

Question

我使用下面的代碼克里特圖像編程（動態在for循環）：

function showImage(source, id) { 
var list = document.getElementById("display-list"); 

//Image 
var cellImage = document.createElement("td"); 
var objImage = document.createElement("img"); 
objImage.classList.add("obj"); 
cellImage.setAttribute("align", "center"); 
cellImage.setAttribute("valign", "bottom"); 
cellImage.appendChild(objImage); 
list.appendChild(cellImage); 

//Checkbox 
var cellCheckbox = document.createElement("td"); 
var objCheckbox = document.createElement("input"); 
objCheckbox.id = id; 
objCheckbox.type = 'checkbox'; 
cellCheckbox.setAttribute("valign", "bottom"); 
cellCheckbox.appendChild(objCheckbox); 
list.appendChild(cellCheckbox); 

objImage.src = source; 
} 

現在，我需要的功能結合在點擊每個圖像的將每個圖像ID傳遞給該函數。我怎樣才能在JScript中做到這一點？

謝謝。

Answer 1

好吧，我只是（一）附加標識的圖像本身和（b）提取onclick處理這裏面的ID。

也許東西有點像這樣：

代碼編輯：

var objImage = document.createElement('img'); 
objImage.setAttribute('myId', id); 

代碼追加：

function myClickHandler(e) 
{ 
    var clickedImage = this; 
    var clickedImageId = this.getAttribute('myId'); 
    // 
    // do something here with the image &/or id 
} 

我沒有使用過的的.ID屬性圖像，因爲你沒有自己設置它們。然而，您已使用複選框的.id屬性。您不能在頁面上有重複的ID，因此只需將objImage的.id設置爲與objCheckbox的.id相同的值就不會使其工作。

Answer 2

我要說的增加這應該工作：

objImage.addEventListener('click', function() { 
    alert(this.id); 
}, false);