1

嗨，我正在尝试使用 JavaScript 动态更改分区的高度，但如果它使用 HTML 标记内的样式标签定义，我只能让 JS 读取 div 的 Height 元素。

如果它在单独的工作表中返回 NaN，我假设是因为它找不到值并且实际上返回 null（我正在使用 ParseInt 使其工作）。

这是HTML：

<div id="dropdown_container">
    <div id="dropdown" style="height:100px;">
    a
    </div>
</div>

（希望 HTML 样式标记）

这是JS：

function clickDown() {
    var el = document.getElementById('dropdown');
    var maxHeight = 200;
    getHeight = parseInt(el.style.height.substring(0,(el.style.height.length)-2));
    console.log(getHeight);
    getHeight += 2;
    el.style.height = getHeight + 'px';
    timeoutHeightInc = setTimeout('clickDown()',15);
    if(getHeight >= maxHeight){
        clearTimeout(timeoutHeightInc);

    }
}

有谁知道这个（错误？）功能的原因。以及解决方案？

这是一个jsFiddle。

尝试将高度移至 CSS 以查看我遇到的问题。

4

1 回答 1

1

ParseInt 缺少它的基数。

你说：

如果它使用 HTML 标记内的样式标签定义，我只能让 JS 读取 div 的 Height 元素

现在您只是在阅读 div 的属性样式。你设置的内联。因此，如果您删除它，那么您将无法再阅读它。有道理？

您想获得计算出的高度。尝试：.offsetHeight

与 inc 一起玩的测试用例的基础。固定基数。这个小提琴

更新：tada：已修复，请参阅此更新的小提琴

function clickDown() {
    var el = document.getElementById('dropdown');
    var maxHeight = 200;
    getHeight = parseInt(el.offsetHeight,10);
    console.log(getHeight);
    getHeight += 2;
    el.style.height = getHeight + 'px';
    timeoutHeightInc = setTimeout('clickDown()',15);
    if(getHeight >= maxHeight){
        clearTimeout(timeoutHeightInc);

    }
}
于 2012-08-12T21:23:03.443 回答