appcan.ajax(options)

实现appcan中网络数据的上传和获取

  • 发起一个ajax请求,并获取相应的内容
  • 常用参数
options.type:        请求的类型，包括GET、POST等

options.url:         要请求的地址 注：get方式请求中携带中文参数，需要对参数进行encode编码，具体函数：encodeURIComponent

options.data:        要请求的URL的参数,如果要上传文件则data数据中必须传一个对象包含一个path的key 例如：data:{file:{path:'a.jpeg'},file2:{path:'b.jpeg'}}上传                a.jpeg,b.jpeg图片

options.dataType:    服务端的响应类型，包括json, jsonp, script, xml, html, text中的一种

options.timeout:     请求的超时时间

options.success(data, status,,requestCode,response, xhr):    请求发送成功后的回调

options.error(xhr, errorType, error,msg):                    请求如果出现错误后的回调;msg: 错误详细信息，服务器返回的result信息
  • script代码
 appcan.button("#submit", "ani-act", function() {

            login();

        })

        function login() {

            var name = $("#username").val();

            var pwd = $("#password").val();

            console.log(name + ":" + pwd);

            appcan.ajax({

                url : "http://testmas.appcan.cn:9000/ODBC/login?uName=" + name + "&pwd=" + pwd,

                type : 'get',

                dateType : 'json',

                success : function(data, status, xhr) {

                    var obj = eval('(' + data + ')');

                    alert(obj.status);

                    if(obj.status == "0"){

                        alert("登录成功");

                    }else{

                        alert("用户名或密码不正确");

                    }

                },

                error : function(xhr, status, errMessage) {

                    alert("errMessage");

                }

            });

        }
  • html代码
<body class="um-vp bc-bg" ontouchstart>

        <div class="ub ub-ver uinn-a3 ub-fv">

            <div class="ub ub-ver uinn uinn-at1">

                <div class="umar-a uba bc-border c-wh">

                    <div class="ub ub-ac ubb umh5 bc-border ">

                        <div class=" uinput ub ub-f1">

                            <div class="uinn fa fa-user sc-text"></div>

                            <input id="username" placeholder="手机/邮箱/用户名" type="text" class="ub-f1">

                        </div>

                    </div>

                    <div class="ub ub-ac umh5 bc-border ">

                        <div class=" uinput ub ub-f1">

                            <div class="uinn fa fa-lock sc-text"></div>

                            <input id="password" placeholder="密码" type="password" class="umw4 ub-f1">

                        </div>

                    </div>

                </div>

                <div class="ub ub-ver">

                    <div class="ub ub-pe uinn-a6 sc-text-active ulev-4">

                        忘记密码

                    </div>

                    <div class="uinn-at1">

                        <div class="btn ub ub-ac bc-text-head ub-pc bc-btn uc-a1" id="submit">

                            登录

                        </div>

                    </div>

                    <div class="uinn-at2 ub sc-text-active ulev-4">

                    </div>

                </div>

                <button type="submit"class="uinvisible"></button>

            </div>

        </div>

        <script src="js/appcan.js"></script>

        <script src="js/appcan.control.js"></script>

    </body>

AppCan学习笔记----Request和登录功能简单实现的更多相关文章

  1. AppCan学习笔记--数据存储及listview简单应用

    AppCan AppCan开发平台简介 AppCan是Hybrid App开发框架即混合开发框架,有官方提供底层功能使用API HTML5和JavaScript只是作为一种解析语言,真正调用的都是Na ...

  2. APPCAN学习笔记004---AppCan与Hybrid,appcan概述

    APPCAN学习笔记004---AppCan与Hybrid,appcan概述 技术qq交流群:JavaDream:251572072 本节讲了appcan的开发流程,和开发工具 笔记不做具体介绍了,以 ...

  3. APPCAN学习笔记003---原生开发与HTML5技术

    APPCAN学习笔记003---原生开发与HTML5技术 技术qq交流群:JavaDream:251572072 1.HTML5的优势:   HTML5强悍牢固的骨架   CSS3精致到每一个毛孔的皮 ...

  4. APPCAN学习笔记001---app高速开发AppCan.cn平台概述

    1.APPCAN学习笔记---app高速开发AppCan.cn平台概述 1. 平台概述 技术qq交流群:JavaDream:251572072 AppCan.cn开发平台是基于HTML5技术的跨平台移 ...

  5. 学习笔记：利用GDI+生成简单的验证码图片

    学习笔记:利用GDI+生成简单的验证码图片 /// <summary> /// 单击图片时切换图片 /// </summary> /// <param name=&quo ...

  6. Directx11学习笔记【一】 最简单的windows程序HelloWin

    声明:本系列教程代码有部分来自dx11龙书及dx11游戏编程入门两本书,后面不再说明 首先,在vs2013中创建一个空的解决方案Dx11Demo,以后的工程都会放在这个解决方案下面.然后创建一个win ...

  7. Flutter学习笔记（14）--StatefulWidget简单使用

    如需转载,请注明出处:Flutter学习笔记(14)--StatefulWidget简单使用 今天上班没那么忙,突然想起来我好像没StatefulWidget(有状态组件)的demo,闲来无事,写一个 ...

  8. 再起航，我的学习笔记之JavaScript设计模式05(简单工程模式)

    我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 前几 ...

  9. 再起航，我的学习笔记之JavaScript设计模式05(简单工厂模式)

    我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 前几 ...

随机推荐

  1. Django后台

    django的后台我们只要加少些代码,就可以实现强大的功能. 与后台相关文件:每个app中的 admin.py 文件与后台相关. 下面示例是做一个后台添加博客文章的例子: 一,新建一个 名称为 zqx ...

  2. 在Excel中把横行与竖列进行置换、打勾号

    在Excel中把横行与竖列进行置换:复制要置换的单元,在新的单元上右键->选择性复制,会出现对话框,选中“置换”,即可在Excel中打勾号,左手按住ALT不放,右手在小键盘也就是右边的数字键盘依 ...

  3. 谢欣伦 - 原创软件 - 游戏专题 - 操蛋的小鸟Fucking Bird

    前段时间朋友介绍了一个最近很火的游戏<Flappy Bird>.在工作之余,我用了三天时间做了一个类似的游戏<Fucking Bird>.一开始分享给了两个女同事,发现她们玩嗨 ...

  4. gem安装报错解决方法

    gem install  rdiscount -- --use-system-libraries

  5. Sage Crm 权限原理分析

    文字是11年写的,贴出来共享一下,先来一张表结构图: 一.区域.表名:[territories] 1.我们先来看看区域表的结构. 从图中前面都是不能为空的字段,都是很重要的.来介绍一下这些字段: Te ...

  6. C#中ToString格式大全

    更多资源:http://denghejun.github.io C 货币 2.5.ToString("C") ￥2.50 D 十进制数 25.ToString("D5&q ...

  7. PHP基础知识之变量

    定义: 变量用一个美元符号后面跟变量名来表示,如:$user 变量引用赋值: 引用赋值用一个&后面跟源变量名来表示,如:$copy=&$user(注:$bar = &(24 * ...

  8. 同一个页面多个page之间的切换

    今天接触了JQ Mobile以下是本小白的理解(不怕大家笑话): 创建移动 web 应用程序的框架:适用于所有流行的智能手机和平板电脑: 将“写得更少.做得更多”这一理念提升到了新的层次:它会自动为网 ...

  9. Linux下的Finger指令

    Linux finger命令 Linux finger命令可以让使用者查询一些其他使用者的资料.会列出来的资料有: Login Name User Name Home directory Shell ...

  10. 自定义cell右侧 多按钮

    #import "ViewController.h" @interface ViewController () <UITableViewDataSource, UITable ...