在使用layui的时候。遇到一个问题。提交表单,没有走ajax,直接提交了表单页面。

原因是因为JQuery未引入

解决办法。引入JQuery或者使用layui自带Jquery

    var $ = layui.jquery;  也可以直接引入官方的Jquery来和平常一样使用
 <script type="text/javascript">

            layui.extend({
admin: '{/}./js/admin'
});
layui.use(['form','admin','jquery'], function(){
var $ = layui.jquery;
var form = layui.form
,admin = layui.admin;
form.on('submit(loginUser)', function(data){ $.ajax({
url:"./loginUser",
type:"post",
data:data.field,
dataType:"json",
success:function (datas) {
alert(1);
if (datas.msg=="index"){
layer.msg('登录成功', function(){
//do something
// location.href='./index'
}); } else {
layer.msg('登录失败,请检查账号密码是否正确');
} }
});
return false;
});
});
</script>

LayUI表单提交不走ajax原因的更多相关文章

  1. layui表单提交与ajax访问webapi

    啊啊啊啊 这个东西实在很蛋疼啊 每次访问webapi就很老火 这里就一下  以后忘记的话就来查阅 不多说 直接开始 首先html页面 新建一个基于layui的form表单页面LayuiForm.csh ...

  2. layui表单提交

    关于layui表单提交  只是简单用一个文本框记录一下提交过程    其他的如下拉框选择框样式可以参考官网 下面直接开始.首 一:前台页面 <!DOCTYPE html><html& ...

  3. Form表单提交,Ajax请求,$http请求的区别

    做过前端同学想必都避免不了要和后台server打交道.而以下这三种与后台交互的方式想必大家都不陌生. Form表单提交,Ajax请求,Angular的$http请求 以前一直搞不清楚什么时候应该用哪种 ...

  4. form表单提交与ajax消息传递

    form表单提交与ajax消息传递 1.前后端传输数据编码格式contentType: urlencoded 对应的数据格式:name=xxx&password=666 后端获取数据:requ ...

  5. form表单提交和ajax表单提交,关于移动端如何通过软键盘上的【搜索】和【前进】进行提交操作

    [文章来源]由于自己对于form研究甚少,所以一直用的都是AJAX进行提交,这次后台提出要用form提交,顺便深入研究一下:之前在做表单的时候,发现input可以通过设置不同的type属性,调用不同的 ...

  6. EXT4.1表单提交(非AJAX)

    Ext.require([ 'Ext.form.*', 'Ext.data.*' ]); Ext.onReady(function(){ Ext.apply(Ext.form.VTypes, { re ...

  7. form表单提交转为ajax方式提交

    <form action="xxx" method="get"> //action的值是请求的url地址 <div class="f ...

  8. layui表单提交使用form.on('submit(sub)',function (){}) 使用ajax请求时回调不执行的原因及解决方法

    ayui使用官方的表单模块form.on('submit(sub)',function (){}) 提交,使用ajax请求向后台请求一个执行结果,根据结果进行处理,出现回调无法执行,并且页面出现了刷新 ...

  9. ajax表单提交较慢原因的解决办法

    ajax提交表单时,发现过了好长时间才有反应.使用F12打开开发人员工具一看,发现提示“provisional headers are shown”. 百度了一下,才知道可能是ajax异步提交和for ...

随机推荐

  1. 面经手册 · 第20篇《Thread 线程,状态转换、方法使用、原理分析》

    作者:小傅哥 博客:https://bugstack.cn Github:https://github.com/fuzhengwei/CodeGuide/wiki 沉淀.分享.成长,让自己和他人都能有 ...

  2. Cys_Control(三) MTextBox

    一.查看TextBox原样式 通过Blend查看TextBox原有样式 <Window.Resources> <SolidColorBrush x:Key="TextBox ...

  3. 第7.27节 Python案例详解: @property装饰器定义属性访问方法getter、setter、deleter

    上节详细介绍了利用@property装饰器定义属性的语法,本节通过具体案例来进一步说明. 一.    案例说明 本节的案例是定义Rectangle(长方形)类,为了说明问题,除构造函数外,其他方法都只 ...

  4. 第8.23节 Python中使用sort/sorted排序与“富比较”方法的关系分析

    一. 引言 <第8.21节 Python中__lt__.gt__等 "富比较"("rich comparison")方法用途探究>和<第8.2 ...

  5. 第15.21节 PyQt(Python+Qt)入门学习:QListView的作用及属性详解

    老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 一.概述 QListView是从QAbstractItemView 派生的类,实现了QAbstrac ...

  6. 谈谈传说中的redo log是什么?有啥用?

    目录 一.引出 redo log 的作用 二.思考一个问题: 三.redo log block 四.redo log buffer 五.redo log的刷盘时机 六.推荐参数 七.redo log ...

  7. RedHat操作指令第3篇

    系统信息 arch 显示机器的处理器架构 uname -m 显示机器的处理器架构 uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件 - (SMBIOS / DMI) ...

  8. buu学习记录(下)(做题是不可能做题的)

    目录: easy_calc 禁止套娃 EasyWeb Babysqli Easyweb easy_serialize_php 我有一个数据库 SSRFme 枯燥的抽奖 EasyPHP 题目解析: ea ...

  9. pymysql出现的问题

    pymysql的使用bug 每次执行sql语句(增删改查)必须commit提交 当重复执行相同slq语句时,如果不commit,fetchall的结果会是上次执行的结果 或者打开pymysql的自动提 ...

  10. AWT06-事件处理

    在AWT中,用户的所有操作都要由事件处理来完成.Frame和组件本身没有处理事件的能力. 1.GUI事件处理机制 定义:在某个组件上发生某种操作时,自动触发某段代码. 事件处理涉及4个重要概念: 事件 ...