<!DOCTYPE html>
<html>
<head>
    <title>Simple Login Form</title>
    <meta charset="UTF-8" />
    <meta name="Designer" content="PremiumPixels.com">
    <meta name="Author" content="$hekh@r d-Ziner, CSSJUNTION.com">
    <link rel="stylesheet" type="text/css" href="css/reset.css">
    <link rel="stylesheet" type="text/css" href="css/structure.css">

    <link href="../Scripts/easyui/themes/default/easyui.css" rel="stylesheet" />
    <link href="../Scripts/easyui/themes/icon.css" rel="stylesheet" />
    <link href="../Scripts/easyui/demo/demo.css" rel="stylesheet" />
</head>

<body>
    <form id="login_form" class="box login">
        <fieldset class="boxBody">
            <label>用户名</label>
            <input id="userId" type="text" tabindex="1" placeholder="" required>
            <label><a href="#" class="rLink" tabindex="5"></a>密码</label>
            <input id="userPwd" type="password" tabindex="2" required>
        </fieldset>
        <footer>
            <input  type="submit" class="btnLogin" value="登 录" tabindex="4">
        </footer>
    </form>
    <footer id="main">
        <a href="http://wwww.cssjunction.com">新烽光电股份有限公司</a> | <a href="http://www.premiumpixels.com">制作 by 软件部</a>
    </footer>
</body>
</html>
<script src="Scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="../Scripts/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../Scripts/easyui/locale/easyui-lang-zh_CN.js"></script>
<script>
    document.getElementById("login_form").onsubmit = function () {
        requiredCheck();
        return false;
    };
    function requiredCheck() {
        var userModel = {
            userId: $.trim($("#userId").val()),
            userPwd: $.trim($("#userPwd").val())
        };
        for (var i in userModel) {
            if (userModel.hasOwnProperty(i)) {
                if (userModel[i] == "") {
                    $.messager.alert('提示', '用户名或密码不能为空', "error");
                    return false;
                }
            }
        }
        $.post("/Login/LoginCheck.ashx", userModel, function (msg) {
            if (msg.code == 0) {
                $.messager.alert('提示', msg.result, "error");
            } else {
                window.location.href = "/index.aspx";
            }
        });
      
    }
</script>

注意: 注册form表单的onsubmit事件，return false(在事件处理函数(onsubmit)里面return false)来阻止表单提交,

js阻止表单提交的更多相关文章

  1. 利用JS 阻止表单提交

    情景一:不存在Ajax异步操作 1 使用背景:会议室预定管理系统中,当表单提交的时候需要验证预约的时间是否符合预定规则(不需要通过访问服务器),否则提示错误信息,阻止表单提交. 2 相关技术点: fo ...

  2. js阻止表单提交的两种方法

    下面直接看代码. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  3. 利用js阻止表单提交

    (1) return false <form name="loginForm" action="login.aspx" method="post ...

  4. jsp——js事件修改属性样式的两种方法（直接赋值、修改属性）、验证表单符合某要求、阻止表单提交、告诉浏览器不要缓存

    代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncodi ...

  5. js 在表单提交前进行操作

    最近在写页面的时候,需要手动写一些在表单进行提交前的验证操作,正好看到了2种阻止表单提交的方法,可以进行一些逻辑处理 方法一:使用return false 原生js写法: <form id=&q ...

  6. form表单验证失败，阻止表单提交

    form表单验证失败,阻止表单提交 效果演示: 贴上完整代码: <!DOCTYPE html> <html lang="en"> <head> ...

  7. Javascript阻止表单提交

    Javascript阻止表单提交 Html 1.<form name="loginForm" action="login.aspx" method=&qu ...

  8. onsubmit阻止表单提交

    在实际开发中往往会遇到检查表单数据的合法性,如果数据不合法,就不让其提交. <!DOCTYPE html> <html> <head> <meta chars ...

  9. JQuery阻止表单提交的方法总结 - 使用onsubmit()验证表单并阻止非法提交

    方法1:<form onsubmit="javascript:confirm()"> 方法内返回false阻止表单提交 示例:代码检测textarea内填写的长度,未填 ...

随机推荐

  1. P2P网络借贷系统-核心功能-用户投标-业务解说

    用户投标是P2P网络借贷系统的核心功能.相对照较复杂,为了更好地梳理业务和技术实现思路,特地具体总结分析下. 输入:用户id-uid.标的id-lid.投标金额-amount 1.依据lid,获得贷款 ...

  2. Eleven puzzle_hdu_3095(双向广搜).java

    Eleven puzzle Time Limit: 20000/5000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) T ...

  3. HipHop PHP简介(转)

    HipHop PHP是FaceBook的一个开源项目,它优化了FaceBook网站Web服务器的运行速度. HipHop 是一个源代码转换器.它将 PHP 代码转换为高度优化的 C++ 代码,然后再使 ...

  4. ES6 对象扩展

    1.属性和变量可以简写 let birth = '2000/01/01'; const Person = { name: '张三', //等同于birth: birth birth, // 等同于he ...

  5. Redis源代码解析：13Redis中的事件驱动机制

    Redis中.处理网络IO时,採用的是事件驱动机制.但它没有使用libevent或者libev这种库,而是自己实现了一个很easy明了的事件驱动库ae_event,主要代码只400行左右. 没有选择l ...

  6. unity3d的三种平面坐标系

    unity3d有如下三种平面坐标系: 1.屏幕坐标系 2.视口坐标系viewport 3.GUI坐标系

  7. 代码收藏系列--jquery--筛选器、事件绑定技巧（转载）

    代码收藏系列--jquery--筛选器.事件绑定技巧 Jquery筛选器的一些常用技巧,比如过滤属性等 /* 过滤获取没有含data-xsui-grid-colspan的节点 */$(this).fi ...

  8. Android开发——跟随手指的小球实现

      今天要实现的是一个跟随手指的小球,说白了就是让小球按着手指滑动的轨迹运动,实现起来还是比较容易的. 用到的类是drawView,我们先自定义一个DrawView组件. DrawView.java: ...

  9. C语言指针的易错点

    1.内存泄漏:申请的堆内存没有释放. 2.内存污染:前面非法操作使用内存(没有报错),后面写着写着就出错.如下代码: 当结构体中只有划线部分代码时,在编译器中编写不会报错,但此时已经造成非法操作内存, ...

  10. 两种方法一句代码隐藏Activity的标题栏

    把Activity的标题栏隐藏有两种方法.一种是在在Activity里面设置javacode.还有一种是在项目的清单文件AndroidManifest.xml中设置模版样式. 一.在Activity中 ...