Question

即使从特定点遍历jQuery，有时也会成为一个谜。

我的HTML结构如下所示：

<div class="grid__area grid__area--empty">
    <div id="streamcontainer" class="streamcontainer">
         <div class="inputer">
            <form action="">
               <input type="text" name="purl" value="XXX" id="" class="">
               <input type="submit" value="Submit" id="submit" class="submiturl"> //starting "this" point
            </form>
         </div>
         <div id="player" class="player"></div> // The Endpoint
    </div>
</div>

起点是点击的 #submit 。

端点应为 #player。

到目前为止，我在许多不同的版本中尝试了什么：

$(this).find('.player').attr('id');
$(this).parent('.streamcontainer').find('.player').attr('id');
$(this).parent('.streamcontainer').closest('.player').attr('id');

感谢您的帮助！

Answer 1

我认为OP意外地使用了.parent（）而不是.parents（）

.parent():  traverses to the immediate parent of 

.parents(): allows us to search through the ancestors of these elements in the DOM tree

所以我认为最初的OP是：

$(this).parents('.streamcontainer').find('.player').attr('id');

除非这是DOM遍历的练习，否则我不确定你为什么要这样做？：）

Answer 2

你可以使用（在我的演示中，我使用'#submit'，但你可以使用它）：

begin try

    declare @s nvarchar(max) = N'
    -- Some expensive query should not be in the transaction
    begin tran
    insert #t1 select getdate()';
    exec (@s);

    commit

end try
begin catch
    select ERROR_NUMBER(), ERROR_MESSAGE(), ERROR_LINE(), @@TRANCOUNT
    if @@TRANCOUNT > 0
        rollback
end catch
select * from #t1

播放器是 inputer anchestor的下一个兄弟。

$('#submit').closest('.inputer').next();

var ele = $('#submit').closest('.inputer').next();

console.log(ele.attr('id'));

Answer 3

使用$（this）.parents（'。inputer'）遍历类inputer的父div，然后在该div旁边找到.player，所以你可以使用$(this).parents('.inputer').next('.player').attr('id')

console.log($("#submit").parents('.inputer').next('.player').attr('id'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="grid__area grid__area--empty">
<div id="streamcontainer" class="streamcontainer">
     <div class="inputer">
        <form action="">
           <input type="text" name="purl" value="XXX" id="" class="">
           <input type="submit" value="Submit" id="submit" class="submiturl"> //starting "this" point
        </form>
     </div>
     <div id="player" class="player"></div> // The Endpoint
</div>
</div>

从“this”返回（遍历）并使用jQuery查找特定元素

3 个答案: