2

我一直在考虑将 wicket 与 jquery-ui 结合使用。这是我所拥有的：

<wicket:head>

 <script src="/jquery/js/jquery-ui-1.10.3.custom.js"></script>
<link rel="stylesheet" type="text/css" href="/jquery/css/custom-theme/jquery-ui-    1.10.3.custom.css">

<script>
$("#menu").menubar();
</script>

</wicket:head>

<wicket:panel>


    <ul id="menu">
        <li><a href="#">Character</a>
        <ul>
        <li>sdf</li>
        <li>sfs</li>
        <li>we</li>
        </ul>

        </li>
        <li><a href="#">Corporation</a></li>
        <li><a href="#">Alliance</a></li>
        <li><a href="#">Fleet</a></li>
    </ul>

当我将此面板添加到我的页面时，它显示为没有 jquery 魔法的无序列表。

任何人都知道检票口内是否有什么我需要做的事情才能完成这项工作？

我已经验证了 jquery 脚本和 css 都被拾取

谢谢

4

1 回答 1

0

当我将此面板添加到我的页面时，它显示为没有 jquery 魔法的无序列表。

Christophs 的评论是正确的。该脚本需要在文档加载时执行。

将 JQuery 功能添加到组件的“Wicket 方式”是通过创建一个行为来负责加载 javascript 和 css 文件并在文档加载时添加 javascript。像这样的东西：

public class JQueryMenuBehavior extends Behavior{

    @Override
    public void renderHead(Component component, IHeaderResponse response){
        response.renderJavascriptReference("/jquery/js/jquery-ui-1.10.3.custom.js");
        response.renderCSSReference("/jquery/css/custom-theme/jquery-ui-1.10.3.custom.css");
        response.renderOnDomReadyJavascript("$('#menu').menubar();");
    }
}

然后只需将此行为添加到“正常”Wicket 无序列表中，您就有了 JQuery 菜单。您可能应该使 id "#menu" 可配置。

这样你就有了一个可重用的行为，你可以将它添加到任何你想显示为 jquery 菜单的列表中。

于 2013-06-30T21:11:38.390 回答