Question

请在HTML中提供以下方案的代码：带行的表 row1 row2 row3

在选择row1时，表应提供下拉row1.1和row1.2 row1 -row1.1 -row1.2 row2 row3

在进一步选择row1.1时，该表应提供下拉行1.1.1 row1 -row1.1 -row1.1.1 -row1.2 row2 row3

我是HTML的初学者。请指导我完成这个。

Answer 1

据我所知，你需要一个accordian。它是一堆行，当您选择其中一行时，它会扩展为子菜单。见here

Answer 2

所以，最后我设法为我的情况获取代码。用于执行下拉功能的Java脚本：

$(document).ready(function()
         {
             $('.RowFather').click(function ()
             {
                 $(this).nextAll('tr').each( function()
                 {
                    if ($(this).is('.RowChild'))
                    {
                       $(this).toggle();;
                    } 
                    else if ($(this).is('.RowGrandChild'))
                    {
                       $(this).hide();;
                    } else {
                        return false;
                    }

                 });
             });

             $('.RowChild').click(function ()
             {
                 $(this).nextAll('tr').each( function()
                 {
                    if ($(this).is('.RowGrandChild'))
                    {
                       $(this).toggle();;
                    } else {
                        return false;
                    }

                 });
             });
             $('.RowFather').nextAll('tr').each( function() {
             if(!($(this).is('.RowFather')))
                 $(this).hide();
            });

         });

HTML：

<tr class="RowFather">
<td>Father</td>
</tr>
<tr class="RowChild">
<td>child</td>
</tr>
 <tr class="RowGrandChild">
 <td> grandchild</td>
 </tr>

下载HTML表格

2 个答案: