jquery.form.js 使用ajax方式提交表单

àì夳堔傛蜴生んèń 2022-12-07 15:08 194阅读 0赞

### 引入jquery文件 ###

<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
    <script src="http://malsup.github.io/jquery.form.js"></script>

### 定义form表单 ###

<form class="mui-input-group" id="myForm" action="{:url('user/login/doLogin')}" method="post">
            <div class="mui-input-row">
                <label>用户名：</label>
            <input type="text" class="mui-input-clear" name="username" placeholder="请输入手机号">
            </div>
            <div class="mui-input-row">
                <label>密码：</label>
                <input type="password" name="password"  class="mui-input-password" placeholder="请输入密码">
            </div>
            <div class="mui-button-row">
                <input type="hidden" name="redirect" value="">
                <button type="submit" class="mui-btn mui-btn-primary" >确认</button>
            </div>
            <div class="checkbox">
                
                <input name="checkbox1" value="Item 1" type="checkbox">
                <label>自动登陆</label>
                
                <a href="{:cmf_url('user/Login/findPassword')}" id="lose">忘记密码</a>
                <a href="{:cmf_url('user/Register/index')}" id="reg">免费注册</a>
            </div>
        </form>

### 调用jquery.form.js ajax提交表单 ###

<script type="text/javascript">
        mui.init();
        $('#myForm').submit(function() { 
            $(this).ajaxSubmit(function(res) { 
                console.log(res);
                if(res.code == 1){ 
                    window.location = "{:url('user/profile/center')}";
                }else{ 
                    mui.alert(res.msg);
                }
            });
            return false; //阻止表单默认提交
        });
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，194人围观）

还没有评论，来说两句吧...

相关阅读

相关 Ajax提交form表单

Ajax提交form表单 $.ajax({ //几个参数需要注意一下 type: "PO

╰+攻爆jí腚メ/ 2022年12月11日 04:21/ 0 赞/ 252 阅读

相关 jquery.form.js 使用ajax方式提交表单

引入jquery文件 <script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>

àì夳堔傛蜴生んèń/ 2022年12月07日 15:08/ 0 赞/ 195 阅读

相关 html ajax提交表单实例,jQuery使用ajaxSubmit()提交表单示例

/ \ 登录 \ @return \/ public String login() \{ HttpServletRequest request= Servle

曾经终败给现在/ 2022年10月10日 02:15/ 0 赞/ 225 阅读

相关使用ajax提交form表单

function mySubmit(){ var chapter=$("myForm").serialize(); $.ajax({ typ

比眉伴天荒/ 2022年08月23日 03:48/ 0 赞/ 268 阅读

相关 ajax提交表单

ajax提交表单在项目中常用，前台无论是简单的html、jsp或者是使用了easyui框架，提交表单都会使用到ajax，extjs框架其实也是使用了ajax只不过对其进

我就是我/ 2022年08月13日 00:56/ 0 赞/ 240 阅读

相关通过Ajax方式提交含有文件的表单

前言：我们通常使用form表单，通过submit来将form表单中含有的文件上传到服务器。通过这种方式页面将会刷新，但是我们有时需要不刷新页面来提交含有文件的表单，这时我们就会

Dear 丶/ 2022年07月28日 08:45/ 0 赞/ 174 阅读

相关 Ajax提交Form表单

1. 背景在java后台开发中，经常要从前端向后台提交表单数据。利用Ajax进行Form表单提交，是很常用的方法。本文主要讲解Ajax提交表单的基本应用。 2. Ajax

迷南。/ 2022年07月21日 01:47/ 0 赞/ 306 阅读

相关 ajax提交form表单

var form=document.getElementById("inspectForm");//inspectForm为Form表单的ID var f

浅浅的花香味﹌/ 2022年05月22日 22:12/ 0 赞/ 288 阅读

相关用Ajax方式提交form表单

用Ajax方式提交form表单一、写一个表单 <table> <tbody> <tr> <td style="width:14px;"> <p>

深碍√TFBOYSˉ_/ 2022年05月17日 13:23/ 0 赞/ 255 阅读

相关 form表单提交（非ajax提交）前表单校验

<form action="{:url('index/index/loginadd')}" method="post" > <div class="userN

ゝ一世哀愁。/ 2021年10月13日 02:59/ 0 赞/ 632 阅读