Question

如何点击提交类型按钮，如何获取表单数据：

var x = form_submit.username;
var y = form_submit.password;
var z = form_submit.full_name;

并且在点击＆＃34;提交＆＃34;时也停止表单消失按钮的代码如下？

<form id="form_submit">
<input type="text" id="username" name="username" required>
<table>
  <tr>
      <th align="left">Full Name</th><td><input type="text" id="full_name" required></td>
  </tr>
  <!--<tr>
      <th align="left">Username</th><td><input type="text" id="username" required></td>
  </tr>-->
  <tr>
      <th align="left">Password</th><td><input type="password" id="full_name" required></td>
  </tr>
  <tr>
      <th align="left">Confirm Password</th><td><input type="password" id="confirm_password" required></td>
  </tr>
  <tr>
      <th align="left">Department</th><td><input type="text" id="department" required></td>
  </tr>
  <tr>
    <th align="left">Supervisor</th>
    <td>
      <select id="supervisor">
        <? for(var i in supervisors){ ?>
          <option value="<?=supervisors[i] ?>"><?=supervisors[i]?></option>
        <?}?>
      </select>
    </td>
  </tr>
  <tr>
      <th align="left">E-mail Address</th><td><input type="email" id="email" required></td>
  </tr>
  <tr>
      <td colspan="2" align="right"><input type="submit" value="Create Account" id='btn_create'></td>
  </tr>
</table>
</form>
<?!= HtmlService.createHtmlOutputFromFile('CSS').getContent(); ?>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>

  $(document).ready(function(){
    $('#form_submit').submit(function(e){
      e.preventDefault();

      var username = $('input[name="username"]', this).val();
      alert(username);
    });
  });
  }
</script>

我猜我应该使用＆＃34; event.preventDefault（）＆＃34;方法，但我不知道放在哪里。

P.S。我正在使用谷歌网站，如果它会有所作为。谢谢。

P.P.S。编辑我的帖子以显示正确的答案。

Answer 1

要防止表单实际提交并处理数据，您必须通过在被调用函数中返回false来取消事件，特别注意您需要在onClick参数中使用return语句。 / p>

onclick="createAccount(this.parentNode)"

=＆GT;

onclick="return createAccount(this.parentNode)"

  function createAccount(frmData){
alert(document.getElementById("form_submit").elements.namedItem("username").value);
    return false;
  }

Answer 2

如此简单的事情 - 似乎有效 - 或许它符合您的需求

<强>更新

根据我的检查，如果你给他们身份证明，你可以轻松地解决儿童形式。例如，您当前可以执行form_submit.children.username并获取值。如果您还将ID放在所有其他标签上，例如table，tr，th等，您将能够深入挖掘

var form_submit = document.getElementById（“form_submit”）;

var username = form_submit.children.username.value;

更新2：

我已将脚本移动到body标签的底部，以便我可以参考提交按钮。获得按钮后，我使用addEventListener注册了“click”事件。现在PreventDefault方法工作了

在表单中实现提交事件

2 个答案: