在 wicket 中调用 javascript 并将 Wicket 中的值设置为参数

Question

我有带有 onClick 事件的检票口组件，我想在其中运行 javascript 代码：

1. 重新加载页面
2. 页面重新加载后，向下滚动到被点击的markupId

我必须将 "markupId" 值作为参数从 wicket 传递到 javascript，以找出我应该向下滚动到哪个位置

WicketComponent.java

    MyPanel div = new MyPanel("div");
    div.add(new AjaxEventBehavior("click") {
        @Override
        protected void onEvent(AjaxRequestTarget target) {
            // some requests...
            String markupId = div.getMarkupId();
            target.appendJavaScript("window.location.reload();");
            target.appendJavaScript(jsReload(markupId));
        }

    div.add(AttributeModifier.replace("onclick", "clicked('" + div.getMarkupId() + "');"));

    @Override
    public void renderHead(IHeaderResponse response) {
        super.renderHead(response);

        response.render(JavaScriptReferenceHeaderItem.forReference(new JavaScriptResourceReference(this.getClass(), "script.js")));
    }

WicketComponent.html

<div wicket:id="div" onclick="clicked('markupId');">Text</div>

script.js

function clicked(markupId) {
    window.location.reload();
}
document.addEventListener("DOMContentLoaded", function (event) {
    let elementOffset = $("#{markupId}").offset().top;  // how to pass here markupId parameter from wicket ?
    let windowOffset = $(window).scrollTop();

    window.scrollTo(0, elementOffset- windowOffset);
});

如何在附加在 renderHead() 中的 javascript 文件中传递参数“markupId”，或者可能有另一种解决方案？我会很感激任何帮助。谢谢！

Answer 1

您应该使用此处所述的位置哈希来解决您的问题：

Can we have code after location.reload(true)?

对于散列值，为您的组件使用固定的标记 ID，例如：

 div.setMarkupId("myMarkupId");
 div.add(new AjaxEventBehavior("click") {
    @Override
    protected void onEvent(AjaxRequestTarget target) {
        // some requests...
        String markupId = div.getMarkupId();
        target.appendJavaScript("window.location.hash = 'myMarkupId'");
        target.appendJavaScript("window.location.reload();");
        //that's it! no other js is needed
    }
 }

我还没有尝试过，但是在页面重新加载后它应该向下滚动到您的组件。