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. Javascript 小技能

     /* @@截取字符串长度,汉字算2个字符 @@return [string]+'...' */ var subString = function(str, len) {     var newLen ...

  2. ASP.NET关于对excel数据导入到数据库

    //*******************************C#(UI代码)********************************/ Web界面上放一个FileUpload 名称为:F ...

  3. python中实现定时器Timer

    实现定时器最简单的办法是就是循环中间嵌time.sleep(seconds), 这里我就不赘述了 # encoding: UTF-8 import threading #Timer(定时器)是Thre ...

  4. XMLHTTPRequest对象的创建与浏览器的兼容问题

    MLHttpRequest 对象是AJAX功能的核心,要开发AJAX程序必须从了解XMLHttpRequest 对象开始. 了解XMLHttpRequest 对象就先从创建XMLHttpRequest ...

  5. ASP.net之策略模式

    设计思路: 用ASP.net设计,调用策略模式.在第一个数和第二个数的文本框中输入数值,单击录题按钮,数值保存在n1,n2文档中,把要做的题都保存完后,单击开始按钮,开始做题,做完单击判断按钮,进行判 ...

  6. java 获取中文字符的首字母

    原理: GB2312编码中的中文是按照拼音排序的 注意: 一些生僻的字无法获得正确的首字母,原因是这些字都是后加入的. import java.io.UnsupportedEncodingExcept ...

  7. JAVA第五次作业

    import javax.media.; import java.awt.; import java.awt.event.; class MediaPlayer extends Frame imple ...

  8. 使用VS2013分析DMP文件

    当一个发布的.NET应用程序出现app crash,无法通过日志分析异常原因时,就需要通过分析DMP文件了,传统方式是通过WinDbg来分析DMP文件,但是WinDbg用起来不是很方便,其实VS就是一 ...

  9. 飞鱼(FlyFish)——便捷的原型在线制作工具

    关于项目原型制作,小菜先前写过一篇文章<FastUI快速界面原型制作工具>,只不过那个是用C#写的原型制作工具,但是感觉用C#写起来比较费力,而且也不太好用,经过高人指点,茅塞顿开,决定重 ...

  10. ASP.NET MVC 5 - 创建连接字符串(Connection String)并使用SQL Server LocalDB

    您创建的MovieDBContext类负责处理连接到数据库,并将Movie对象映射到数据库记录的任务中.你可能会问一个问题,如何指定它将连接到数据库? 实际上,确实没有指定要使用的数据库,Entity ...