提交表单输入字段添加了javascript

前端之家收集整理的这篇文章主要介绍了提交表单输入字段添加了javascript前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在做一个简单的表单来创建民意测验,因此我想要添加额外的输入字段,以防用户在轮询中想要更多的选项.

我已经创建了JavaScript代码,为表单添加了一个新的输入字段,但是当表单提交时,动态添加的输入字段不会被发布(我使用标准的提交按钮).

有一些方法可以将动态添加的字段发布/识别为表单的一部分吗?

  1. <form id="myForm" method="post">
  2. <input type="submit">
  3. <input type="text" name="poll[question]">
  4. <input type="text" name="poll[option1]">
  5. <input type="text" name="poll[option2]">
  6. </form>
  7. <a href="javascript:addOption();">Add option</a>
  8.  
  9. <script>
  10. var optionNumber = 3; //The first option to be added is number 3
  11. function addOption() {
  12. var theForm = document.getElementById("myForm");
  13. var newOption = document.createElement("input");
  14. newOption.name = "poll[option"+optionNumber+"]"; // poll[optionX]
  15. newOption.type = "text";
  16. theForm.appendChild(newOption);
  17. optionNumber++;
  18. }
  19. </script>

解决方法

你的代码工作正常:
  1. <?PHP
  2. print_r($_REQUEST)
  3. ?>
  4. <html>
  5. <body>
  6.  
  7. <form id="myForm" method="post">
  8. <input type="submit">
  9. <input type="text" name="poll[question]">
  10. <input type="text" name="poll[option1]">
  11. <input type="text" name="poll[option2]">
  12. </form>
  13. <a href="javascript:addOption();">Add option</a>
  14.  
  15. <script>
  16. var optionNumber = 3; //The first option to be added is number 3
  17. function addOption() {
  18. var theForm = document.getElementById("myForm");
  19. var newOption = document.createElement("input");
  20. newOption.name = "poll[option"+optionNumber+"]"; // poll[optionX]
  21. newOption.type = "text";
  22. theForm.appendChild(newOption);
  23. optionNumber++;
  24. }
  25. </script>
  26. </body>
  27. </html>

单击添加选项两次并得到

Array([poll] => Array([question] => [option1] => [option2] => [option3] => [option4] =>))

猜你在找的HTML相关文章