在javascript中点击“提交”按钮后，如何获取表格div +错误消息的高度？

Question

因此，我一直在尝试使此表单正常工作（css和javascript），但我遇到了一些麻烦：我拥有表单，并且基本上一切正常，例如，我为div表单提供了一个容器：formbody，以及用于提交，清除等的容器。top div设置为height：auto; 位置：绝对； 底部设置为“无”。 它只有一个宽度。

当用户单击提交按钮时，表单主体将需要调整大小，但是我不知道如何获取表单的新大小以设置底部div的位置。

我刚刚添加了更多的CSS-有一个背景div只能将表单的模板保持打开状态-我已将其设置为relative-但formbody的位置是绝对的，因为高度需要自动设置才能调整大小错误（当我将其设置为不带位置的自动：绝对时，formbody缩小为20px）。

    .background {
    width: 0px;
    height: 700px;
    position: relative;
    z-index:999;
    }

.formbody {
    background-image: url('');
    background-repeat: no-repeat;
    background-position: left bottom;
    position:absolute;
    left:0px;
    top:50px;
    width:700px;
    height:auto;
    padding-bottom:20px;
    border:1px solid #d2d2d2;
}

.bottom {
    width:700px;
}

Answer 1

像这样的东西

<script>

    var formbody_width= $(".formbody").width();

    $(".submit").live("click", function) {

       $(".formbody").css("height", formbody_width + 300 + "px");     

    }

</script>

Answer 2

这行得通吗？ （这是实时预览： http : //jsfiddle.net/rcMGn/1/ ）

基本上，我在这里要做的是获取具有类formwidth的第一个节点（根据您的css），并使用DOM模型获取其样式属性。

函数getElementsByClass将返回文档中具有class formwidth类的所有元素的数组（我假设只有一个），并从该数组中获取第一个元素（假定为1），然后对其进行样式设置。

您不需要关心函数...要获得宽度，只需下面代码的第一行...

formWidth = getElementsByClass('formbody',null,'form')[0].offsetWidth;

要获得高度，请使用以下一项：

formHeight = getElementsByClass('formbody',null,'form')[0].offsetHeight;

并从Dustin Diaz的文件中复制该功能，以下功能...

function getElementsByClass(searchClass,node,tag) {
    var classElements = new Array();
    if ( node == null )
        node = document;
    if ( tag == null )
        tag = '*';
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;
    var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
    for (i = 0, j = 0; i < elsLen; i++) {
        if ( pattern.test(els[i].className) ) {
            classElements[j] = els[i];
            j++;
        }
    }

    return classElements;
}