如何找到一個具有顯示屬性集的div集合中的div

我有一個用divs構建的表格。用戶可以點擊一個「生命力表」，這將會下滑其「細節表」。當摺疊時，jQuery將details表的display屬性設置爲「none」。當可見時，顯示屬性是「表」。如何找到一個具有顯示屬性集的div集合中的div

我需要能夠識別是否有一個細節表是可見的，並將該按鈕的id保存在該vitals表中，這樣，當我需要重新加載/重新填充表時，我可以獲得該細節表重新加載後再次可見。

<div id="mainTable"> 
    <div class="recordRow"> 
     <div class="recordCell"> 
      <div class="vitalsTable"> 
       <div class="vitalsRow"> 
        <div class="vitalsCell"> 
         <label>some text</label> 
        </div> 
        <div class="vitalsCell"> 
         <!-- button id is unique to identify the Record Row --> 
         <button id="btnViewEditRecord-4" value="Details" title="Click to View and Edit this Record">Details</button> 
        </div> 
       </div> 
      </div> 
      <div class="detailsTable" style="display: table;"> 
       <div class="detailsRow"> 
        <div class="detailsCell"> 
         <label>some text</label> 
        </div> 
        <div class="detailsCell"> 
         some text 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

    <div class="recordRow"> 
     <div class="recordCell"> 
      <div class="vitalsTable"> 
       <div class="vitalsRow"> 
        <div class="vitalsCell"> 
         <label>some text</label> 
        </div> 
        <div class="vitalsCell"> 
         <!-- button id is unique to identify the Record Row --> 
         <button id="btnViewEditRecord-5" value="Details" title="Click to View and Edit this Record">Details</button> 
        </div> 
       </div> 
      </div> 
      <div class="detailsTable" style="display: none;"> 
       <div class="detailsRow"> 
        <div class="detailsCell"> 
         <label>some text</label> 
        </div> 
        <div class="detailsCell"> 
         some text 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

我試着做一些像

if ($('#peopleListTable').find('.personDetailsTable').prop('display') == 'table') {

，但沒有奏效。

我該如何做到這一點？

UPDATE 爲了清楚起見，我正在改寫我的問題。以上信息仍然相關，但：

如何返回其下一個div的顯示屬性設置爲表的按鈕的ID？

來源

2013-09-16 marky

爲什麼不讓事情變得簡單？爲什麼不只是在改變這些元素的'display'屬性的同時添加一個類，然後使用['hasClass']（http://api.jquery.com/hasClass/）查找具有該類的元素？？ – Alvaro

'＃mainTable' div中只有一個div（如果有的話）將顯示屬性設置爲「table」。我需要找到該div並獲得該div中按鈕的ID。所以當添加另一個類時，如果display：table對於一個div已經是唯一的，那麼確實沒有意義。 – marky

是的，有一個原因。這通常是在jQuery中完成的。（用作狀態的類）它將是一個更快的選擇器（目前爲止），它將提高代碼的可讀性，這是程序員在大多數情況下應該尋找的。如果你想走複雜的道路，那就把它拿走吧。我只是提供建議。 – Alvaro

您可以使用jQuery的filter方法是：

var buttonId = $('.detailsTable').filter(
    // only grab divs that have a display of table in their "style" declaration 
    function() { 
     return $(this).css('display') === 'table'; 
    }) 
    // look in the previous DIV for a button element, and grab it's ID 
    .prev().find('button').attr('id');

JSFiddle

這就是說，我會考慮重組你的HTML /重新思考你的做法，因爲這在很大程度上取決於你的HTML結構。正如評論中指出的那樣，使用類來標識元素，而不是依賴於內聯樣式，將是一種更好的方法。

來源

2013-09-16 18:02:38

謝謝。我會看看調整我的方法。 – marky

如何找到一個具有顯示屬性集的div集合中的div

回答

相關問題