Question

我的页面中有一个动态生成的表，它由第3方源（它的MLS提要）生成，包含10行，5列。我不能要求更多。我想将它显示为一列，因此，就像一个列表。我已经设法在Firefox，Safari和Chrome上做到了这一点，但是当我在IE中使用它时，我得到的两个效果是：每行中的每个TD元素都像扑克中的一副牌一样重叠，同时保持TR间距 - 或者 - 它将TD和TR全部堆叠成一堆IE垃圾。最后，我在CSS中所做的一切似乎都改变了我的表的宽度或TD宽度。 o.O.开始脱毛战术。

页面示例： http://www.vdbestates.com/beta/residential.html（在Firefox和IE中查看以获得最佳说明）

HTML：

<table id="IDX-showcaseWrapper-residentialListings" cellspacing="0" cellpadding="0" border="0" style="width: 100%;">
    <tbody>
        <tr style="z-index: -1;">
            <td class="IDX-showcaseDetails" valign="top" style="text-align: center; padding: 0px 0px 8px;"></td>
            <td class="IDX-showcaseDetails" valign="top" style="text-align: center; padding: 0px 0px 8px;"></td>
            <td class="IDX-showcaseDetails" valign="top" style="text-align: center; padding: 0px 0px 8px;"></td>
            <td class="IDX-showcaseDetails" valign="top" style="text-align: center; padding: 0px 0px 8px;"></td>
            <td class="IDX-showcaseDetails" valign="top" style="text-align: center; padding: 0px 0px 8px;"></td>
        </tr>
        <tr style="z-index: -1;"></tr>
            ...
        <tr style="height: auto; z-index: -1;"></tr>
    </tbody>
</table>

我正在使用jQuery动态地为其他浏览器中的TD分配新的“top”值，使用for循环，将索引乘以TD高度：

var tCell;
for(var i = 0; i < size; i++) {
    tCell = $('td.IDX-showcaseDetails').eq(i);
    $(tCell).attr('style', 'top:' + (i * 250) + 'px;');     
}

CSS：（所有浏览器）

table[id^=IDX-showcaseWrapper] {
    position:relative;
    min-height:1200px !important;
    padding-bottom:20px;
    z-index:1;
    display:block;
}
table[id^=IDX-showcaseWrapper] tr {
    position:relative;
}
.IDX-showcaseDetails {
    display:list-item !important;
    list-style-type:none;
    width:480px;
    height:275px;
    position:relative;
    clear:both;
    border-bottom:1px solid #5c4a57;
    margin-bottom:15px;
    padding:0px;
    z-index:1;
}

Answer 1

为什么不从表中读取数据，将其重新写入列表，然后删除表？乱搞CSS来模仿这肯定会让你发疯。请改用JavaScript。

Answer 2

我不是很害羞我理解你的问题，但是如何写一个新的清单而不是弄乱旧的清单呢？迭代旧的，获取值并打印新的html。

如何将HTML表格转换为Internet Explorer中的列表

2 个答案: