layui使用ajax提交表单,layui获取表单数据,layui不用form提交数据

反诈示警:如遇到文章内跳转至别的网站或产生需要交钱,交易等行为,均为诈骗行为,请谨慎对待。对于网上兼职、刷单、刷信誉的就是诈骗,请勿相信!需要提供身份证明、短信验证和短信链接点击都是诈骗, 请不要提供!同时请下载“国家反诈中心”App能自查自检,规避诈骗电话,免遭损失。

layui中不使用form原始方法提交表单, 而是使用ajax提交表单, 处理业务会方便些, 下面做一下记录: html

<form class="layui-form">
    <div class="layui-form-item">
      <button class="layui-btn" id="submit" lay-submit="" lay-filter="daqin">点击提交表单</button>
    </div>
</form>

layui使用ajax提交表单,layui获取表单数据,layui不用form提交数据,插图,来源:资源仓库www.zycang.com js

<script>
layui.use(['jquery', 'form'], function(){
    var $ = layui.jquery
    ,form = layui.form;
      form.on('submit(daqin)', function(formData){
      $.ajax({
          url:"http://tool.qinziheng.com/mianchongzhi/index",
          type:"POST",
          dataType: "json",
          data:formData.field,
            success: function(resData){
                console.log(resData);
            }
      })
      return false;
  });
});
</script>

其中 form.on('submit(daqin)', function(formData){}); 中submit(daqin)里的参数要与form button中lay-filter="daqin"保持一致 function(formData){return false}的 formData.field 保存了表单中的数据 末尾要使用 return false 不然会刷新页面

如需 WordPress 优化加速、二次开发、网站维护、企业网站建设托管等服务,点此联系我 | 近期站内热门福利推荐:
文章版权及转载声明

本文地址:https://www.zycang.com/223.html
文章转载或复制请以超链接形式并注明来源出处。 本文最后更新于:2022-07-16 18:26:09
声明:某些文章或资源具有时效性,若有 错误 或 所需下载资源 已失效,请联系客服QQ:11210980

喜欢就支持一下吧
点赞228赞赏 分享
评论 抢沙发

请登录后发表评论