Question

以下是我的结构

- 点击flight_itinerary类应该打开flight_summary class html。

<table>
    <tr>
        <td>
            <table>
                <tr>
                    <td><a class="flight_itinerary">Flight Itinerary</a> </td> 
                </tr>   
            </table> 
        </td>
    </tr>
    <tr class="flight_summary" style="display:none;">
        <td>
            <table>
                <tr>
                    <td></td> 
                </tr>   
            </table> 
        </td>           
    </tr>
</table>

这是我试图打开tr标签的脚本

    $(document).on('click', '.flight_itinerary', function(){
            $(this).closest("tr").find('.flight_summary').toggle();
});

Answer 1

.find()查找与选择器匹配的后代。当您从tr转到距离.flight_itinerary最近的.flight_summary时，.flight_summary不是其中的后代。

要从.flight_itinerary转到tr，您必须前往第二 tr，然后转到下一个 .find之后。您不需要在tr使用.flight_summary，因为$(document).on('click', '.flight_itinerary', function() { $(this).parents("tr").eq(1).next().toggle(); }); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr><td> <table> <tr> <td><a class="flight_itinerary">Flight Itinerary</a> </td> <tr> </table> </td></tr> <tr class="flight_summary" style="display:none;"> <td><table> <tr> <td>Flight Summary</td> <tr> </table> </td></tr> </table>。

private static void Main()
{
    for (int i = 0; i < Environment.ProcessorCount; i++)
    {
        ThreadPool.QueueUserWorkItem(new WaitCallback(ThreadProc));
    }

    Console.ReadLine();
}

static void ThreadProc(Object stateInfo)
{
    while (true)
    {
       // do something
    }
}

-- SAMPLE Data
declare @data table(id int, name varchar(10), type varchar(100))
insert into @data(id, name, type) values
(1, 'ABCD', 'A, B, C, D')
, (2, 'EFG', 'E, F, G')
, (3, 'HI', 'H, I')

-- Split All Rows and Types
Select ID, Name, ltrim(rtrim(value))
From (
    Select *,  Cast('<x>'+Replace(d.type,',','</x><x>')+'</x>' As XML) As types
    From @data d
) x
Cross Apply (
    Select types.x.value('.', 'varchar(10)') as value
    From x.types.nodes('x') as types(x)
) c

Answer 2

到达那里是一种尴尬的方式，但表格中的表格无济于事

$(document).on('click', '.flight_itinerary', function(){
    $(this).parent('tr').parent('table').parent('tr').parent('table').find('.flight_summary').toggle();
});

为了使它更清洁，你可以在主表（包含所有行和内部表的大表）中添加一个类，然后执行此操作;

// Assuming we added a class of 'main' to the outermost table

$(document).on('click', '.flight_itinerary', function(){
    $(this).parents('table.main').find('.flight_summary').toggle();
});

那会找到主表，然后用类flight-summary

搜索它的子行

如果您想要第一个匹配的.flight_summary实例，那么就可以这样做

$(document).on('click', '.flight_itinerary', function(){
    $(this).parents('table.main').find('.flight_summary').eq(0).toggle();
});

Jquery：找到最接近的tr类

2 个答案: