需要使用jquery或javascript的元素的父索引

我有三个<ul>，它们在点击按钮时展开。并非所有三个<ul>都会显示 - 只有当有通知显示时。我现在对这些值进行了硬编码，但我可以根据需要对它们进行实例化。需要使用jquery或javascript的元素的父索引

现在，它们在扩展时互相覆盖。我希望其他人在列表展开时移动，以避免彼此覆盖。我正在考虑点击按钮的索引，然后重新设置其他的底部样式。我需要获得被点击的按钮的父亲的索引，可能使用jQuery，但直接的JavaScript也不错。谁能帮忙？

这里是我的代码：

<div id="NotificationDiv"> 
    <ul id="noticeLead" class="notification_base notification_Lead"><button id="notification_button">Lead Notice</button> 
    <div> 
     <li id="urlLead" class="notification_urlNotice notification_notice"> 
      <a target="_blank" >Check Lead #1</a> 
     </li> 
     <li id="urlLead" class="notification_urlNotice notification_notice"> 
      <a target="_blank" >Check Lead #2</a> 
     </li> 
    </div> 
</ul> 

<ul id="noticeTask" class="notification_base notification_Task"><button id="notification_button">Task Notice</button> 
    <div> 
     <li id="urlTask" class="notification_urlNotice notification_notice"> 
      <a target="_blank" >Check Task #5</a>  
     </li> 
     <li id="urlTask" class="notification_urlNotice notification_notice"> 
      <a target="_blank" >Check Task #6</a> 
     </li> 
    <div> 
</ul> 

<ul id="noticePolicy" class="notification_base notification_Policy"><button id="notification_button">Policy Notice</button> 
    <div> 
     <li id="urlPolicy" class="notification_urlNotice notification_notice"> 
      <a target="_blank" >Check Policy #3</a> 
     </li> 
     <li id="urlPolicy" class="notification_urlNotice notification_notice"> 
      <a target="_blank" >Check Policy #4</a> 
     </li> 
    </div> 
</ul> 
</div>

而在$(document).ready，我有：

$('.notification_base').on('click', 'button', function(){ 
    $(this).closest('.notification_base').find('.notification_urlNotice').slideToggle(); 
});

来源

2015-12-16 npayne

不知道我理解你想要什么，但你应该看看https://api.jquery.com/index/ – juvian

您的标记是无效的。 div不是UL元素的允许子元素。 – isherwood

而且一个按钮也不是有效的孩子。 – epascarello

谢谢大家对您的输入。我将结构更改为一个表，将.parent类分配给标题行，将.child类分配给数据行，并将此代码置于jQuery就绪函数中，并且工作良好。

function getChildren($row) { 
    var children = []; 
    while($row.next().hasClass('child')) { 
    children.push($row.next()); 
    $row = $row.next(); 
    }    
    return children; 
}   

$('.parent').on('click', function() { 
    var children = getChildren($(this)); 
    $.each(children, function() { 
    $(this).toggle(); 
}) 
});

来源

2015-12-17 19:03:22 npayne

试试这个：

var myParentId; //Here you'll store the id of the clicked element 
$('.notification_base').on('click', 'button', function(){ 
    $(this).closest('.notification_base').find('.notification_urlNotice').slideToggle(); 
    myParentId = $(this).attr("id"); 
});

来源

2015-12-16 16:06:00 Bardo

需要使用jquery或javascript的元素的父索引

回答

相关问题