js-ajax-form

优质
小牛编辑
113浏览
2023-12-01

js-ajax-form 异步表单提交

此组件用于 ajax表单提交,你只要设置表单的属性就可以进行 ajax 表单提交了,下面此组件最精简的形式:

<form class="js-ajax-form" action="你的提交地址" method="post">
   <input type="text" name="username">
   <input type="text" name="password">
   <button class="js-ajax-submit" type="submit">提交</button>
</form>

请注意表单的class属性,button的 class和 type 属性

更改提交类型为 GET

<form class="js-ajax-form" action="你的提交地址" method="get">
   <input type="text" name="username">
   <input type="text" name="password">
   <button class="js-ajax-submit" type="submit">提交</button>
</form>

表单里有多个 button,你可以通过button 的data-action 属性定义 buttton的提交地址

<form class="js-ajax-form" action="你的提交地址" method="post">
   <input type="text" name="username">
   <input type="text" name="password">
   <button class="js-ajax-submit" type="submit">提交</button>
     <button class="js-ajax-submit" type="submit" data-action="你的提交地址2">提交2</button>
</form>