54、实例 jQuery设计树形结构(类似多级菜单)

来源：互联网发布：matlab将数据存入矩阵编辑：程序博客网时间：2024/05/18 12:01

<!doctype html><html><head><meta charset="utf-8"><title>jQuery设计树形结构(类似多级菜单)</title><script type="text/javascript" src="jquery-2.1.0.js"></script><script>$(document).ready(function(e) {    $("li:has(ul)").click(function(event){if(this==event.target)//如果当前li元素就是事件触发的目标对象，防止是触发父对象的事件{if($(this).children().is(':hidden')){$(this).children().show();$(this).css("list-style-image","url(images/-.png)");}else{$(this).css("list-style-image","url(images/+.png)");$(this).children().hide();}}});});</script></head><body><ul class="tree">    <li>菜单1</li>    <li>菜单2    <ul>        <li>菜单2.1</li>        <li>菜单2.2</li>                    </ul>        </li>    <li>菜单3   <ul>        <li>菜单3.1</li>        <li>菜单3.2            <ul>                <li>菜单3.2.1</li>                <li>菜单3.2.2</li>                <li>菜单3.2.3</li>                                                </ul>            </li>                    </ul>        </li>        <li>菜单4</li></ul></body></html>

0 0