zoukankan      html  css  js  c++  java
  • mui APP与服务器之间的交互原理

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <title></title>
        <script src="js/mui.min.js"></script>
        <link href="css/mui.min.css" rel="stylesheet"/>
        <script type="text/javascript" charset="utf-8">
        /*提前预加载其他页面,这样再打开已加载好的页面就会有很好的效果了*/
              mui.init();
        </script>
    </head>
    <body>
    <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">hello</h1>
    </header>
    
    <div class="mui-content">
        <button type="button" id="btn1"> 获取服务器端数据</button>
    </div>
        
    </body>
    <script type="text/javascript">
    mui.init();
    mui.plusReady(function(){
        document.getElementById('btn1').addEventListener('tap',function(){
            mui.ajax({
                url      : 'http://demo.hcoder.net/index.php',
                type     : 'GET',
                success  : function(data){
                    mui.toast(data);
                },
                error    : function(xhr,type,errorThrown){
                    mui.toast(type);
                }
            });
        });
    });
        
        
        mui.post('http://server-name/login.php',{
            username:'username',
            password:'password'
        },function(data){
            //服务器返回响应,根据响应结果,分析是否登录成功;
                ...
            },'json'
        );
            
        mui.get('http://server-name/list.php',{category:'news'},function(data){
            //获得服务器响应
            ...
            },'json'
        );
        mui.getJSON('http://server-name/list.php',{category:'news'},function(data){
            //获得服务器响应
            ...
            }
        );
    </script>
    </html>
  • 相关阅读:
    LeetCode: Maximum Product Subarray 解题报告
    LeetCode: Populating Next Right Pointers in Each Node II 解题报告
    LeetCode: Populating Next Right Pointers in Each Node 解题报告
    LeetCode: Word Search 解题报告
    C语言文件操作
    多线程
    C语言函数指针的使用
    进程
    网络编程
    进程间通信——管道通信
  • 原文地址:https://www.cnblogs.com/zc290987034/p/8870010.html
Copyright © 2011-2022 走看看