javascript - 我只能從控制台調用點擊 function 按鈕。 按鈕不點擊

Question

最近我從一個網站聘請了一位女士來幫助我進行特定設計（我再也找不到她了）。 我采用了該設計並在服務器端工作並完成了我的 web 應用程序。 客戶要求在圖像上有一個燈箱縮放選項。 我使用了很多方法，但似乎無法從前端觸發點擊事件，我只能從瀏覽器控制台使用“image.click()”方法。 這是一個 html 代碼片段：

<div class="row">
<div class="col-6" style="text-align: center; margin: auto;">
<img class="img-fluid img-thumbnail" style="cursor: pointer;"src="img-src">
</div>
</div>
<div id="lightbox" class="lightbox"><img src=""></div>

我想對多張圖片做縮放效果

Array.from($('.img-fluid')).forEach(image => {
$(image).click(function (e) {
        e.preventDefault();
        $('#lightbox img').attr('src', $(image).attr('src'))
        $('#lightbox').toggle()
    });
})

唯一可行的方法是當我使用帶有點擊方法的瀏覽器控制台時。

關於原因有什么建議嗎？

Answer 1

根據文檔：

HTMLElement.click()方法模擬鼠標點擊元素。

所以，如果你想在用戶點擊圖片時觸發事件，正確的方法是使用onclick方法。

當用戶單擊一個元素時，將引發click事件。 它按順序在 mousedown 和 mouseup 事件之后觸發。

或者您可以添加一個EventListener ，這取決於您的需要。