如何通过纯javascript实现表单提交

墨蓝 2022-06-02 06:56 375阅读 0赞

# 如何通过纯javascript实现表单提交 #

通常，如果是POST方法，一般使用vuejs+axios，或使用Jquery实现表单提交。有些地方，我想使用纯JS实现，比方简单的登陆跳转。话不多说，看原代码，

laravel中的HTML部分，如果不是laravel，去掉 \{ \{csrf\_field()\}\}这一行即可

<form class="form-signin" id="myform">
        {
       {csrf_field()}}            
        .........此处省略若干......
        <h2 class="form-signin-heading">请登录</h2>            
        <label for="inputName" class="sr-only">用户名</label>
        <input name="name" id="inputName" class="form-control" placeholder="Login Name / 登陆名" required autofocus="" type="text">
        <label for="inputPassword" class="sr-only">密码</label>
        <input name="password" value="" id="inputPassword" class="form-control" placeholder="Password / 密码" required type="password">
        <button class="btn btn-lg btn-primary btn-block" type="submit">登陆</button>
    </form>

题外话：如果是正常的表单提交，不使用JS，一般第一行得这样写

这里因为使用JS，所以删除了`method="POST" action="/admin/login"` 跳转及方法信息。

回归正题，再看JS

嗯，简单吧！