我已经发布了我的网页的完整正文。我需要使用id productgrid2访问父div的第二个div中的元素。这将是下面代码中第二个高度为219.3999的div。具体来说,我需要第二个div的表的高度。这将是具有类k-selectable的表。问题是这些元素是动态生成的,我需要通过jQuery访问它们。环顾四周但没有任何东西符合我独特的情况。有人可以帮忙吗?
<div id="productgrid2" style="border: 1px solid rgb(54, 57, 64); box-shadow: rgb(136, 136, 136) 7px 7px 5px; margin-bottom: 15px; height: 250px;" data-role="grid" class="k-grid k-widget">
<div class="k-grid-header" style="padding-right: 14px;">
<div class="k-grid-header-wrap" data-role="resizable">
<table role="grid">
<colgroup>
<col style="width:170px">
<col style="width:135px">
<col style="width:120px">
<col style="width:75px">
<col style="width:55px">
<col style="width:60px">
<col style="width:190px">
</colgroup>
<thead role="rowgroup">
<tr role="row">
<th role="columnheader" data-field="rfi_name" data-title="RFI/Click2Connect" class="k-header" data-role="columnsorter"><a class="k-link" href="#">RFI/Click2Connect</a></th>
<th role="columnheader" data-field="SelectedOptions" data-title="Fulfillment" class="k-header k-with-icon k-filterable" data-role="columnsorter"><a class="k-grid-filter" href="#" tabindex="-1"><span class="k-icon k-filter" data-original-title="" title=""></span></a><a class="k-link" href="#">Fulfillment</a></th>
<th role="columnheader" data-field="InteractiveID" data-title="Interactive ID" class="k-header" data-role="columnsorter"><a class="k-link" href="#">Interactive ID</a></th>
<th role="columnheader" data-field="ISCI" data-title="ISCI" class="k-header" data-role="columnsorter"><a class="k-link" href="#">ISCI</a></th>
<th role="columnheader" data-field="IsAddressable" data-title="Addressable" class="k-header" data-role="columnsorter"><a class="k-link" href="#">Addressable</a></th>
<th role="columnheader" data-field="Status" data-title="Status" class="k-header" data-role="columnsorter"><a class="k-link" href="#">Status</a></th>
<th class="k-header">View, Duplicate or Delete</th>
</tr>
</thead>
</table>
</div>
</div>
<div class="k-grid-content" style="height: 219.399999976158px;">
<table role="grid" data-role="selectable" class="k-selectable" style="height: auto;">
<colgroup>
<col style="width:170px">
<col style="width:135px">
<col style="width:120px">
<col style="width:75px">
<col style="width:55px">
<col style="width:60px">
<col style="width:190px">
</colgroup>
<tbody role="rowgroup">
<tr data-uid="c2f68916-0f9e-4a54-a5a2-c95f2de2afe7" role="row">
<td role="gridcell">Hunhhh?</td>
<td role="gridcell">Mail</td>
<td role="gridcell">000000ET00025868</td>
<td role="gridcell">654654</td>
<td role="gridcell">Yes</td>
<td role="gridcell">Draft</td>
<td role="gridcell"><a class="k-button k-button-icontext k-grid-Edit" href="#"><span class=" k-icon k-i-search ob-icon-only"></span></a><a class="k-button k-button-icontext k-grid-Duplicate" href="#"><span class=" k-icon k-i-restore ob-icon-only"></span></a><a class="k-button k-button-icontext k-grid-Delete" href="#"><span class=" k-icon k-i-close ob-icon-only"></span></a></td>
</tr>
<tr class="k-alt" data-uid="5749733a-f164-4557-b6b1-d45c7bb74d60" role="row">
<td role="gridcell">Test RFI 1</td>
<td role="gridcell">Mail</td>
<td role="gridcell">000000ET00025867</td>
<td role="gridcell">232654</td>
<td role="gridcell">No</td>
<td role="gridcell">Draft</td>
<td role="gridcell">
<a class="k-button k-button-icontext k-grid-Edit" href="#">
<span class=" k-icon k-i-search ob-icon-only"></span>
</a>
<a class="k-button k-button-icontext k-grid-Duplicate" href="#">
<span class=" k-icon k-i-restore ob-icon-only"></span>
</a>
<a class="k-button k-button-icontext k-grid-Delete" href="#">
<span class=" k-icon k-i-close ob-icon-only"></span>
</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
答案 0 :(得分:1)
你是说你无法访问高度,因为当你运行这个功能时元素还没有存在?如果是这样,你可以试试这个。它是一个jQuery函数,它等待一个元素存在,然后运行你想要的任何函数。我很久以前就从其他一些SO问题中得到了它,但我不记得在哪里或我会提到这个问题。
$.fn.waitUntilExists = function(handler, shouldRunHandlerOnce, isChild) {
var $elements, $this, found;
found = "found";
$this = $(this.selector);
$elements = $this.not(function() {
return $(this).data(found);
}).each(handler).data(found, true);
if (!isChild) {
(window.waitUntilExists_Intervals = window.waitUntilExists_Intervals || {})[this.selector] = window.setInterval(function() {
$this.waitUntilExists(handler, shouldRunHandlerOnce, true);
}, 500);
} else {
if (shouldRunHandlerOnce && $elements.length) {
window.clearInterval(window.waitUntilExists_Intervals[this.selector]);
}
}
return $this;
};
您可以像这样使用它:
$(selector).waitUntilExists(functionToRunOnSelector);
答案 1 :(得分:1)