treeview複選框菜單

好吧，我想在html中編寫並行複選框菜單，但不知何故，我的邏輯沒有幫助。可能有些專家可以幫助我一點。這是我希望我的菜單看起來如何treeview複選框菜單

[] Menu 1     [] Menu 2 

    [] Item 1     [] Item 5 

    [] Item 2     [] Item 4

項目1,2位於菜單1和5,4位於菜單2下方框括號表示複選框。菜單下的項目實際上是動態收集的，它們在不同菜單下的編號可能會有所不同。

來源

2009-12-13 yogsma

如果您的問題僅限於HTML和CSS，則可以使用padding和margin屬性進行適當的縮進。

如果你有關於編程邏輯的問題來生成這樣的樹結構，請寫下你正在使用的語言。

來源

2009-12-13 09:03:00 Alex

我使用Java（JSP），用於產生這樣的結構。 – yogsma 2009-12-13 09:04:12

對不起，但我使用PHP，所以我不知道我該如何幫助你。 PHP模板引擎不適合您的情況。但是，您可以使用XSL轉換來生成HTML輸出。據我所知，你可以在JSP中使用它。鏈接XSLT元素for-each - http://www.w3schools.com/xsl/xsl_for_each.asp – Alex 2009-12-13 09:09:43

我會建議使用列表和浮動的div。根據列表可以很容易地嵌套儘可能多的複選框樹。

<div style="float:left;"> 
Menu 1 
<ul> 
    <li>Item 1</li> 
    <li>Item 2 
     <ul> 
     <li>Item 2a</li> 
     <li>Item 2b</li> 
     </ul> 
    </li> 
</ul> 
</div> 

<div style="float:left; margin-left:30px;"> 
Menu 2 
<ul> 
    <li>Item 1</li> 
    <li>Item 2 
     <ul> 
     <li>Item 2a</li> 
     <li>Item 2b</li> 
     </ul> 
    </li> 
</ul> 
</div>

這將有雙重嵌套。只需在給定的無序列表<ul>標記中添加更多列表項目<li>，即可按特定縮進間隔製作任意數量的複選框。

來源

2009-12-13 09:11:11 Roman

我會試試這個。 – yogsma 2009-12-13 09:23:55

很酷。另外，如果你想抵消你的專欄，以避免它們靠得太近，你可以像Alex Pilipenko建議的那樣用一個邊距來實現（例如，爲div風格添加margin-left：xx）。編輯的答案包括這個。 – Roman 2009-12-13 09:29:30

你可能想看看jQuery庫jstree。我將它用於我的樹形視圖，它絕對是最先進的樹視圖。
它是驚人的可配置，並易於使用。它有一個複選框插件，我在我的項目中使用。這對我來說非常合適。
開發非常活躍，所以即使您可能發現問題，開發人員也會非常反應，並會幫助您。

看看這裏：http://jstree.com 和複選框演示是here

好運:)

來源

2009-12-13 09:52:25

treeview複選框菜單

回答

相關問題