一、用戶登錄驗證 (給服務(wù)器提交數(shù)據(jù))

//輸入maj，然后回車鍵，一堆代碼就自動出來了，爽asdf
mui.ajax(url,{
    data:{
        username:'admin',
        password:'123456'
    },
    dataType:'json',//服務(wù)器返回json格式數(shù)據(jù)
    type:'post',//HTTP請求類型
    timeout:10000,//超時時間設(shè)置為10秒；
    success:function(data){
        //服務(wù)器返回響應(yīng)，根據(jù)響應(yīng)結(jié)果，分析是否登錄成功；
         console.log(‘登錄成功’);//這里不做驗證，只是測試訪問
    },
    error:function(xhr,type,errorThrown){
        //異常處理；
        console.log(type);
    }
});

二、讀取數(shù)據(jù)庫，然后寫入列表 (從服務(wù)器解析JSON數(shù)據(jù))
1.首先在某個位置，例如底部放置一個ul,給個ID。
<div class="mui-bottom">
<ul class="mui-table-view" id="list">
//這里應(yīng)該有l(wèi)i項的，但我們讓它自動生成，數(shù)據(jù)有多少行，li就有多少個
</ul>
</div>

2.讀取數(shù)據(jù)庫中的數(shù)據(jù)

               mui.ajax(url,{//url可以是一個php接口文件
            data:{
            },
            dataType:'json',//服務(wù)器返回json格式數(shù)據(jù)
            type:'post',//HTTP請求類型
            timeout:10000,//超時時間設(shè)置為10秒；
            
                success:function(data){
                  
  //可以直接解析JSON，瀏覽器控制臺輸出來，例如谷歌瀏覽器，按F12，選擇控制臺窗口就可以看到輸出了。
               // console.log(JSON.stringify(data)); 
                

                //下面才是重頭戲，動態(tài)輸出li選項
                var list = document.getElementById("list");
                var fragment = document.createDocumentFragment();
                var li;
                
               //遍歷獲得的數(shù)據(jù)集data
            mui.each(data,function (key,value) {
          
                //定義變量接收數(shù)據(jù)庫字段的值
                var id  = value.id;
                    title = value.title;
                  detail = value.detail;
              
                    li = document.createElement('li');
                    li.className = 'mui-table-view-cell mui-media';
                    li.innerHTML = '<a class="mui-navigate-right" id='+ id +' data-audio='+ name +'>'+
                                     
          '<div class="mui-media-body">'+title+
                    '<p class="mui-ellipsis">'+detail+'</p>'+
          '<p class="mui-ellipsis">途徑：A站，廣州站</p>'+
                                        '</div>'+
                                    '</a>';
                    fragment.appendChild(li);
  
            })
              list.appendChild(fragment);
            },

 error:function(xhr,type,errorThrown){
                alert("錯誤");
                console.log(type);
            }
           });