javascript - 如何从spring Controller 方法更新html img src？

Question

我将验证码添加到我的 JSP 页面(kaptcha 库)。看起来像这样

@RequestMapping(value = "/captcha.jpg", method = RequestMethod.GET)
    public void captcha(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        super.captcha(req, resp);
    }

在页面中

<img src="captcha.jpg"/>

现在我需要创建按钮来更新此验证码。(或者当我点击验证码图像时)

我试过了

<a href="captcha.jpg">
            <img src="captcha.jpg"/>
            </a>

但是当我单击图像时它会单独打开。 我只需要在点击后刷新验证码图像。

也许是 JavaScript，也许是其他东西？怎么办？

更新

我创建了这个

<script>
                function update() {
                    document.getElementById('my-image').setAttribute('src', "captcha.jpg");
                }
            </script>
            <a href="" onclick="update()">
                <img src="captcha.jpg" id="my-image"/>
            </a>

它可以工作，但是在 img 更新后我的页面向上滚动。我该如何修复它？

Answer 1

您的页面正在向上滚动，因为 anchor 标记的默认行为是滚动到顶部，除非您为其指定 URL、要滚动到的元素或 javascript:声明。

要修复它，请输入 javascript:里面href anchor 标记，或删除 anchor 标记并放入 onclick图像上的事件如下所示:

<img src="captcha.jpg" id="my-image" onclick="update()" />