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. Struts 2的数据校验

    既然说到了Struts 2的数据校验,我们该怎么去实现呢?又是通过什么来实现呢? 就让我带着大家一起来走进Struts 2的数据校验吧. 首先我们会想到在Stuts 2的登录案例中我们定义了一个Act ...

  2. OPENDATASOURCE读取远程数据库数据中文乱码问题-sqlserver R2

    insert into kraft_sync_Store(StoreName,StoreCode,Province,PrefectureCity,CountyCity,Region,Area,Unit ...

  3. CocoaPods pod install

    加参数可以提升更新的速度 方法1: pod install --verbose --no-repo-update pod update --verbose --no-repo-update 方法2: ...

  4. 【译】PHP的变量实现（给PHP开发者的PHP源码-第三部分）

    文章来自:http://www.aintnot.com/2016/02/12/phps-source-code-for-php-developers-part3-variables-ch 原文:htt ...

  5. UWP开发之控件：用WebView做聊天框

    目录 说明 WebView存在的价值 使用WebView的几个重要技巧 使用WebView做的聊天框 说明 大家都知道,无论是之前的Winform.WPF还是现在的IOS.Android开发中,都存在 ...

  6. 单独使用jdbc编程问题总结（一）

    在学习Mybatis之前,我们先来回顾JDBC编程的相关知识.在此基础上深入的学习Mybatis框架.如有错误,敬请指正. (一)首先我们既然要使用jdbc,当然是要操作数据库了.创建一个名为:myb ...

  7. Andrew Ng机器学习公开课笔记 -- 学习理论

    网易公开课,第9,10课 notes,http://cs229.stanford.edu/notes/cs229-notes4.pdf 这章要讨论的问题是,如何去评价和选择学习算法   Bias/va ...

  8. Drupal8重命名上传的中文名文件

    完整的模块代码文件在Coding.net上,想直接使用的请前往下载:https://coding.net/u/yamus/p/chinese_rename/git/tree/master 最近吧Dru ...

  9. iOS-在团队开发过程中控制代码版本

    Cornerstone Svn简单使用指南: -- what if 负责编写 一.安装并拷贝项目 1.第一步:安装svn.2.第二步:第一个使用svn,找到“Check Out Working Cop ...

  10. 使用JAVA编写电话薄程序，具备添加，查找，删除等功能

    //该程序需要连接数据库.根据word文档要求所有功能均已实现.//大部分方法基本差不多,//在查询修改的时候能输出 最大ID号 和最小ID号,并且可以对输入的ID号进行判断是否存在(具体方法请查看 ...