如何在Spring MVC中为无序列表实现扩展/折叠功能

Question

I'm trying to build a navigation for my Spring MVC application and I have a multilevel unordered list in my jsp page. 我正在尝试为Spring MVC应用程序构建导航，而我的jsp页面中有一个多级无序列表。 I'd like to have a possibility of expanding/collapsing on image click (maybe a little "plus" sign). 我想扩大/缩小图片点击次数（可能有点“加号”）。 Is there a way to do this in Spring MVC application? 在Spring MVC应用程序中有没有办法做到这一点？

Edit.. For now I'm trying just to achieve simple expand and collapse (I haven't added "plus" sign images etc.) This is the last thing I've tried 编辑..现在，我正在尝试仅实现简单的扩展和折叠（我还没有添加“加号”标志图像等。）这是我尝试的最后一件事

script.js script.js

$('.listitem').click(function () { $(this).find('ul').slideToggle(); }); $（'。listitem'）。click（function（）{$（this）.find（'ul'）。slideToggle（）;}）;

index.jsp 的index.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head>
    <title></title>
    <script type="text/javascript"
            src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script type="text/javascript" src="${context}/js/script.js"></script> </head> <body>

    <div style="float: left; width: 20%">
        <h4>${treeView}</h4>
    </div>
    <div style="float: left; width: 80%" id="thePage">
        <iframe id="frame1" name="frame1" scrolling="auto" runat="server" style="float: left; width: 100%; height: 950px;"></iframe>
    </div> </body> </html>

What I have rendered... 我呈现的东西

<html> <head>
    <title></title>
    <script type="text/javascript"
            src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script type="text/javascript" src="/js/script.js"></script> </head> <body>


<div style="float: left; width: 20%">
    <h4><?xml version="1.0" encoding="UTF-8" standalone="no"?>
        <ul class="list">MyList
            <li class="listitem">
                <ul>HO.jws
                    <li class="listitem">
                        <ul>HO1.jpr
                            <li class="listitem">
                                <ul><a href="http://localhost:8000/resources//HO1//file1.html"
                                       target="frame1">file1.ext</a>
                                    <li class="listitem">
                                        <ul>Names</ul>
                                    </li>
                                    <li class="listitem">
                                        <ul>Functions</ul>
                                    </li>
                                    <li class="listitem">
                                        <ul>Properties</ul>
                                    </li> ...

Answer 1

Spring MVC just acts as a controller mechanism, what you'd do here is control the "plus" sign with some sort of javascript that would invoke the Spring MVC controller to get the list and when you clicked the + symbol, it just collapsed or expanded a list in the HTML. Spring MVC只是充当一种控制器机制，您在这里要做的是使用某种JavaScript控制“加号”，这些JavaScript会调用Spring MVC控制器来获取列表，并且当您单击+符号时，它就会折叠或扩展了HTML中的列表。

You could just get the contents of the list on page load, saying in jQuery with $(document).ready() , get the list an build the html then all the + symbol does is change if this list appears in the DOM. 您可以只获取页面加载时列表的内容，在jQuery中使用$(document).ready() ，获取列表的构建html，如果此列表出现在DOM中，则所有+符号都会更改。

如何在Spring MVC中为无序列表实现扩展/折叠功能

问题描述

1 个解决方案

解决方案1
1 2013-10-28 11:42:44

如何在Spring MVC中为无序列表实现扩展/折叠功能

问题描述

1 个解决方案

解决方案1 1 2013-10-28 11:42:44

解决方案1
1 2013-10-28 11:42:44