0

我有一个网页,顶部有一组按钮。我正在编写一个函数,以便在单击最右侧按钮时将表单放置在最右侧按钮的右侧。我正在使用以下 JavaScript 代码。

var optionsForm = document.createElement("form");
optionsForm.setAttribute('method',"post");
optionsForm.style.display = "inline";
MakeDropDown(optionsForm);  // Make drop-down list element
document.getElementsByTagName('body')[0].appendChild(optionsForm);

但是,它将表单/下拉列表放在页面底部,而不是放在顶部按钮的右侧。我宁愿不必使用绝对定位,因为我希望表单位于最右侧按钮的右侧,并且可能有不同数量的按钮。

4

3 回答 3

3

它将它放在底部,因为您要将它附加到正文中。

如果您希望它出现在特定按钮之后,那么您需要:

  1. 得到那个按钮
  2. 获取该按钮的父节点
  3. 测试按钮是否是其父级中的最后一个子级
  4. appendChild 或 insertBefore 将表单放入该父级

如果您希望它与按钮内联显示,那么您还需要确保按钮内联显示(以及新表单)并且没有其他东西会破坏布局(例如浮动)。

于 2013-05-15T21:11:43.293 回答
1

那是因为您将表单附加到您的身体:document.getElementsByTagName('body')[0]. 您需要在按钮之后附加它,例如:document.getElementById('my-buttons-container').appendChild(optionsForm);

希望这可以帮助!

于 2013-05-15T21:11:35.757 回答
1

您应该在这些按钮之后附加表单。为此,您需要获取这些按钮的 parentNode,并使用buttonNode.insertBefore(buttonsParent, buttons) 看看这个:Javascript Append Child AFTER Element

于 2013-05-15T21:16:46.997 回答