0

我正在尝试实现一个照片库（我想你们所有人都已经知道了，因为我发布了很多问题:)）。如果我在 DOM 元素的 onclick 属性中分配一个函数，则该函数可以正常工作。

var img_thumb = document.createElement('img');
img_thumb.src = photos[i].img_thumb; 

img_thumb.onclick = function showImage(img_thumb) {
   var index = arr_thumb.indexOf(img_thumb.target);
   document.getElementById('largeImgPanel').appendChild(arrow_right);
   document.getElementById('largeImg').src = arr_big[index].src;
   showLargeImagePanel();
   unselectAll();
};

现在这只是函数，如果我尝试在此处添加相同的 showImage 函数并在单击箭头时调用它以更改显示的图片，则它不起作用。

function showLargeImagePanel() {
    document.getElementById('largeImgPanel').style.visibility = 'visible';
}

function unselectAll() {
   if(document.selection) document.selection.empty();
   if(window.getSelection) window.getSelection().removeAllRanges();
}

我尝试以不同的方式重写它，但没有任何变化，如果我单击箭头，“largeImagePanel”就会关闭。

这是我最后一个版本的 showImage 函数：

function showImage(img_src) {
   document.getElementById('largeImg').src = img_src;
   showLargeImagePanel();
   unselectAll();
};

有人可以告诉我有关我的问题的任何想法吗？

如果我将相同的属性“onclick”写入箭头对象，“largeImgPanel”会再次关闭>：

arrow_right.onclick = function() {
    document.getElementById('largeImgPanel').appendChild(arrow_right);
    document.getElementById('largeImg').src = next;
    showLargeImagePanel();
    unselectAll();
};
4

0 回答 0