javascript - 如何在 <script> 标签内的表单中添加更多输入

Question

我的脚本标签内有一个表单，我希望在提交之前添加更多输入字段。我的提交按钮不起作用，我认为这是我尝试此操作时如何访问提交按钮的问题。

下面是我的脚本标签内的表单

<script defer type="text/html" id="template-RegisterView">

<div class="modal">

    <div class="signup-popup  pwd ">
        <div class="title">Sign up now</div>
        <p>and we'll find your right geek!</p>
        <form id="signup-form" action="bin/request/best.php" method="post">
           <input class="email" autocapitalize="off" autocorrect="off" autocomplete="email" name="email" placeholder="Enter your e-mail" type="email">
           <input class="password" name="password" placeholder="Create password" type="password">

           <button class="signup-submit submitDialog" type="button">Sign up</button>

        </form>
    </div>
</div>

这是我想用来添加更多输入字段的脚本

<script type="text/javascript">
       $(document).on('click', '.signup-submit', function () {
            $("#signup-form").submit( function(eventObj) {
                alert("fwf");
                  $('<input />').attr('type', 'hidden')
                      .attr('name', "something")
                      .attr('value', "something")
                      .appendTo('#signup-form');
                  return true;
              });

         });
</script>

Answer 1

而不是返回 true 添加 $("#signup-form").submit();

进一步说明

您当前的代码正在执行以下操作。

$(document).on('click', '.signup-submit', function () {

1. 上面这行表示当带有signup-submit类的按钮上发生单击事件时，然后执行作为$(document).on的第三个参数提供的函数。方法。

2. 当函数执行时，它会执行以下几行

   $("#signup-form").submit( function(eventObj) {
alert("fwf");
$('<input />').attr('type', 'hidden')
.attr('name', "something")
.attr('value', "something")
.appendTo('#signup-form');
return true;
});

3. 当 ID 为 signup-form 的表单发生提交事件时，这些行实际上是定义或附加一个函数。 。

4. 但它们实际上并没有触发提交事件。
5. 要触发提交事件，您需要编写 $("#signup-form").submit(); () 内没有任何内容。这将触发表单上的提交事件。

您可以查看此link的更多详细信息。它的官方文档解释了如何使用提交来附加处理函数，或者如果您想触发表单的提交事件，那么如何执行此操作。