Javascript，圖片點擊（功能，onclick）

Question

因此，我正在php上創建此基本圖像網站，並且嘗試在每個人資料上創建一個圖像空間。 我希望在單擊圖像時將其最大化（當前是這樣）。 然后再次單擊它會返回到原來的位置（它不會這樣做）。 您可以在此處查看示例http://www.uk-sf.com/profile.php?view=pgallery:17

但是這里是代碼：下面是單擊的img元素

<img id="1" onclick="clickimage(this)" class="pgall" src="XXX">

那么你有JavaScript功能

function clickimage(id)
        {
            var y = document.getElementsByClassName('pgall');
            var x = document.getElementsByClassName('pgall2');

            var length = y.length,
            element = null;
            for (var i = 0; i < length; i++) {
              element = y[i];
              element.className = 'pgall';
            }

            var length = x.length,
            element = null;
            for (var i = 0; i < length; i++) {
              element = x[i];
              element.className = 'pgall';
            }

            id.className = 'pgall2';
        }

如您當前所見，它將始終更改單擊第二個CSS類“ pgall2”的內容。 它需要做的就是如果id.className ==“ pgall2”，也將其更改為“ pgall”。 但是，我嘗試使用if語句執行此操作，但它不起作用。

                if(id.className == 'pgall')
                {
                id.className = 'pgall2';
                }
                else {
                id.className = 'pgall';
                }

Answer 1

您的函數不會添加類，而是會替換整個類的值。 通過更改類，您實際上是在創建新元素。 此時您沒有相同的事件處理程序。

如何正確添加其他類： 如何向給定元素添加類？

有關動態元素事件的更多信息： http : //toddmotto.com/attaching-event-handlers-to-dynamically-created-javascript-elements

---

更新：您有可用的jQuery。 為什么不使用它？

jQuery('.pgall').click(function() {
    jQuery(this).toggleClass('pgall pgall2');
});

http://jsfiddle.net/isherwood/vPC7r/