baigoSubmit

这是一个表单 ajax 提交插件

本插件基于 bootstrap 4.3.* 版本与 font-awesome 图标插件，主要用到 css 样式和 modal 组件，请使用者注意！

• 方法
• 配置
• 演示
• 下载

目录结构

1. baigoSubmit.js 提交插件
2. baigoSubmit.min.js 提交插件压缩版

基本使用

载入文件

<!-- jQuery 库 -->
<script src="jquery.min.js" type="text/javascript"></script>

<!-- bootstrap 库 -->
<script src="bootstrap.bundle.min.js" type="text/javascript"></script>
<link href="bootstrap.min.css" type="text/css" rel="stylesheet">

<!-- 插件 -->
<script src="baigoSubmit.min.js" type="text/javascript"></script>

下载 jQuery

下载 Bootstrap

表单 HTML

<form name="login_form" id="login_form" action="login.php">
  <div>
    <label>用户名</label>
    <input type="text" name="admin_name" id="admin_name">
  </div>

  <div>
    <label>密码</label>
    <input type="password" name="admin_pass" id="admin_pass">
  </div>

  <button type="submit">登录</button>
</form>

初始化并提交，如：

<script type="text/javascript">
// 配置
var opts_submit = {
  msg_text: {
    submitting: '正在登录'
  },
  modal: {
    btn_text: {
      close: '关闭',
      ok: 'OK'
    }
  },
  jump: {
    url: 'index.php',
    text: '正在跳转',
    delay: 1000
  }
};

$(document).ready(function(){
  // 初始化
  var obj_submit = $('#login_form').baigoSubmit(opts_submit);

  // 提交
  $('#login_form').submit(function(){
    obj_submit.formSubmit();
  });
});
</script>

服务器返回

插件接受 json 对象的返回，如：

{
  msg: '提交成功',
  rcode: 'y010101',
  user_id: 2
}