1

我有一个 JavaScript 多步骤表单，它隐藏前面的步骤（它们是字段集）并显示下一个步骤display: none;，它必须绝对定位才能获得正确的效果。

  • 问题在于，将其定位绝对会使其脱离流程，并且不会将其下方的内容向下推。
  • 我试图创建的解决方案是将绝对 div 包装在父级相对定位的 div 中，然后使用 JavaScript 将父级的高度设置为可见的绝对 div 的高度。

任何人都可以帮助我使用 javascript 吗？

现在，我知道在下一个按钮上我需要这样的东西： var divHeight = ((document.getElementById('fieldset').offsetHeight) + 'px'); document.getElementById('variable-div').style.height = divHeight; 但是第一部分是错误的，因为我无法通过 ID 获取字段集，我需要获取 display:block 并且我不知道该怎么做

任何帮助将不胜感激！

编辑：这里是（更新的）jsfiddle：http: //jsfiddle.net/n4dk7/6/

编辑2：找到解决方案： var fieldsetHeight = $("fieldset").filter(':visible').height() + 'px'; $('#variable-div').height(fieldsetHeight);

4

1 回答 1

1

我确实看到您找到了解决方案。如果您需要更多想法，这里有一个小提琴供您查看：

在下一个和上一个之外

var mainDiv = $( '#variable-div' );
var currentFieldset = $('fieldset');
mainDiv.css('marginBottom', (currentFieldset.height() + 5) + 'px');

下一个里面

next_fs = $(this).parent().next();
mainDiv.css('marginBottom', (next_fs.height() + 5) + 'px');

jsfiddle.net/pertrai1/ydjm2/1/

于 2013-07-14T12:22:34.320 回答