<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!--标准mui.css-->
<link rel="stylesheet" href="css/mui.min.css">
<link href="css/mui.picker.css" rel="stylesheet" />
<link href="css/mui.poppicker.css" rel="stylesheet" />
<style>
body {
font-family: "微软雅黑";
background-color: #efeff4;
/**font-size:14px;**/
}
.mui-views,
.mui-view,
.mui-pages,
.mui-page,
.mui-page-content {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
width: 100%;
height: 100%;
background-color: #efeff4;
}
.mui-pages {
top: 46px;
height: auto;
}
.mui-scroll-wrapper,
.mui-scroll {
background-color: #efeff4;
}
.mui-page.mui-transitioning {
-webkit-transition: -webkit-transform 300ms ease;
transition: transform 300ms ease;
}
.mui-page-left {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.mui-ios .mui-page-left {
-webkit-transform: translate3d(-20%, 0, 0);
transform: translate3d(-20%, 0, 0);
}
.mui-navbar {
position: fixed;
right: 0;
left: 0;
z-index: 10;
height: 44px;
background-color: #f7f7f8;
}
.mui-navbar .mui-bar {
position: absolute;
background: transparent;
text-align: center;
}
.mui-android .mui-navbar-inner.mui-navbar-left {
opacity: 0;
}
.mui-ios .mui-navbar-left .mui-left,
.mui-ios .mui-navbar-left .mui-center,
.mui-ios .mui-navbar-left .mui-right {
opacity: 0;
}
.mui-navbar .mui-btn-nav {
-webkit-transition: none;
transition: none;
-webkit-transition-duration: .0s;
transition-duration: .0s;
}
.mui-navbar .mui-bar .mui-title {
display: inline-block;
width: auto;
}
.mui-page-shadow {
position: absolute;
right: 100%;
top: 0;
width: 16px;
height: 100%;
z-index: -1;
content: '';
}
.mui-page-shadow {
background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
background: linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
}
.mui-navbar-inner.mui-transitioning,
.mui-navbar-inner .mui-transitioning {
-webkit-transition: opacity 300ms ease, -webkit-transform 300ms ease;
transition: opacity 300ms ease, transform 300ms ease;
}
.mui-page {
display: none;
}
.mui-pages .mui-page {
display: block;
}
.mui-page .mui-table-view:first-child {
margin-top: 15px;
}
.mui-page .mui-table-view:last-child {
margin-bottom: 30px;
}
.mui-table-view {
margin-top: 20px;
}
.mui-table-view span.mui-pull-right {
color: #999;
}
.mui-table-view-divider {
background-color: #efeff4;
font-size: 14px;
}
.mui-table-view-divider:before,
.mui-table-view-divider:after {
height: 0;
}
.head {
height: 40px;
}
#head {
line-height: 40px;
}
.head-img {
width: 40px;
height: 40px;
}
#head-img1 {
position: absolute;
bottom: 10px;
right: 40px;
width: 40px;
height: 40px;
}
.update {
font-style: normal;
color: #999999;
margin-right: -25px;
font-size: 15px
}
.mui-fullscreen {
position: fixed;
z-index: 20;
background-color: #000;
}
.mui-ios .mui-navbar .mui-bar .mui-title {
position: static;
}
/*问题反馈在setting页面单独的css*/
#feedback .mui-popover{
position: fixed;
}
#feedback .mui-table-view:last-child {
margin-bottom: 0px;
}
#feedback .mui-table-view:first-child {
margin-top: 0px;
}
.radius {
width: 35px;
height: 35px;
line-height: 35px;
margin-right: 20px;
text-align: center;
border-radius: 30px;
font-size: 14px;
}
.bcred {
background-color: #006741;
color: #F2F2F2;
font-weight: bold;
}
.bcblue {
background-color: #EC971F;
color: #F2F2F2;
font-weight: bold;
}
.mui-media-body {
height: 35px;
line-height: 35px;
}
.fgray {
color: #ACACB4;
font-size: 16px;
}
.agree {
font-size: 14px;
}
.mui-popup-text{
height:200px;
overflow-y: auto;
}
.setTime{
padding-right:20px;
}
.setsendTimetitle{
margin-left:20px;
}
</style>
</head>
<body class="mui-fullscreen">
<!--页面主结构开始-->
<div id="app" class="mui-views">
<div class="mui-view">
<div class="mui-navbar">
</div>
<div class="mui-pages">
</div>
</div>
</div>
<!--页面主结构结束-->
<!--单页面开始-->
<div id="setting" class="mui-page">
<!--页面标题栏开始-->
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<h1 class="mui-center mui-title">上门取件</h1>
</div>
<!--页面标题栏结束-->
<!--页面主内容区开始-->
<div class="mui-page-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<form id='login-form' class="mui-input-group" >
<ul class="mui-table-view">
<li class="mui-table-view-cell mui-media">
<a href="#address" class="mui-navigate-right" id="address1">
<div class="mui-pull-left radius bcred">寄</div>
<div class="mui-media-body fgray">
请选择寄件地址
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="#address" class="mui-navigate-right" id="address2">
<div class="mui-pull-left radius bcblue">收</div>
<div class="mui-media-body fgray">
请选择收件地址
</div>
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" id="setsendTime">
<div class="mui-pull-left setsendTimetitle">收件时间</div>
<div class="mui-pull-right setTime" id="sendTime">
1小时以内
</div>
</a>
</li>
</ul>
</form>
<form class="mui-input-group" style="margin-bottom: 15px;">
<div class="mui-input-row mui-radio mui-right">
<label>常规件</label>
<input name="radio1" type="radio" >
</div>
<div class="mui-input-row mui-radio mui-right">
<label>大件</label>
<input name="radio1" type="radio" checked>
</div>
</form>
<form class="mui-input-group" >
<div class="mui-input-row">
<label>费用</label>
<input type="text" id="cose" style="text-align:right;" readonly="readonly" value="8.5元">
</div>
</form>
<br/>
<div class="mui-input-row">
<button id='login' class="mui-btn mui-btn-block mui-btn-primary" style="width:100%">支付</button>
</div>
<div class="mui-input-row mui-checkbox mui-text-center">
<label class="agree">提交即同意<a id="alertMessage">《快递运单契约条款》</a></label>
<!--<input id="agree" name="checkbox1" value="Item 1" type="checkbox">-->
</div>
</div>
</div>
</div>
</div>
<!--页面主内容区结束-->
<div id="address" class="mui-page">
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
<span class="mui-icon mui-icon-left-nav"></span>返回
</button>
<h1 class="mui-center mui-title">地址管理</h1>
</div>
<div class="mui-page-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<div style="padding: 10px 10px;">
<div id="segmentedControl" class="mui-segmented-control">
<a class="mui-control-item mui-active" href="#item1" id="addtab1">寄件人地址</a>
<a class="mui-control-item" href="#item2" id="addtab2">收件人地址</a>
</div>
</div>
<div>
<div id="item1" class="mui-control-content mui-active">
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
</ul>
</div>
<div id="item2" class="mui-control-content">
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="js/mui.min.js"></script>
<script src="js/mui.view.js"></script>
<script src="js/mui.picker.min.js"></script>
<script src="js/sendTime.data.js"></script>
<script>
mui.init({
swipeBack: true //启用右滑关闭功能
});
//初始化单页view
var viewApi = mui('#app').view({
defaultPage: '#setting'
});
//初始化单页的区域滚动
mui('.mui-scroll-wrapper').scroll();
document.getElementById("alertMessage").addEventListener('tap', function() {
mui.alert('Hello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUI', '快递服务协议', function() {
//info.innerText = '你刚关闭了警告框';
});
});
document.getElementById("address1").addEventListener('tap', function() {
document.getElementById("item1").classList.add("mui-active");
document.getElementById("item2").classList.remove("mui-active");
document.getElementById("addtab1").classList.add("mui-active");
document.getElementById("addtab2").classList.remove("mui-active");
});
document.getElementById("address2").addEventListener('tap', function() {
document.getElementById("item1").classList.remove("mui-active");
document.getElementById("item2").classList.add("mui-active");
document.getElementById("addtab1").classList.remove("mui-active");
document.getElementById("addtab2").classList.add("mui-active");
});
(function($,doc) {
//处理view的后退与webview后退
var oldBack = $.back;
$.back = function() {
if (viewApi.canBack()) { //如果view可以后退,则执行view的后退
viewApi.back();
} else { //执行webview后退
oldBack();
}
};
var cityPicker = new mui.PopPicker({
layer: 2
});
cityPicker.setData(sendTime);
var sendTimeObj = doc.getElementById('sendTime');
document.getElementById("setsendTime").addEventListener('tap', function(event) {
cityPicker.show(function(items) {
sendTimeObj.innerText = items[0].text + " " + items[1].text;
//返回 false 可以阻止选择框的关闭
//return false;
});
});
})(mui,document);
</script>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!--标准mui.css-->
<link rel="stylesheet" href="css/mui.min.css">
<link href="css/mui.picker.css" rel="stylesheet" />
<link href="css/mui.poppicker.css" rel="stylesheet" />
<style>
body {
font-family: "微软雅黑";
background-color: #efeff4;
/**font-size:14px;**/
}
.mui-views,
.mui-view,
.mui-pages,
.mui-page,
.mui-page-content {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
width: 100%;
height: 100%;
background-color: #efeff4;
}
.mui-pages {
top: 46px;
height: auto;
}
.mui-scroll-wrapper,
.mui-scroll {
background-color: #efeff4;
}
.mui-page.mui-transitioning {
-webkit-transition: -webkit-transform 300ms ease;
transition: transform 300ms ease;
}
.mui-page-left {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.mui-ios .mui-page-left {
-webkit-transform: translate3d(-20%, 0, 0);
transform: translate3d(-20%, 0, 0);
}
.mui-navbar {
position: fixed;
right: 0;
left: 0;
z-index: 10;
height: 44px;
background-color: #f7f7f8;
}
.mui-navbar .mui-bar {
position: absolute;
background: transparent;
text-align: center;
}
.mui-android .mui-navbar-inner.mui-navbar-left {
opacity: 0;
}
.mui-ios .mui-navbar-left .mui-left,
.mui-ios .mui-navbar-left .mui-center,
.mui-ios .mui-navbar-left .mui-right {
opacity: 0;
}
.mui-navbar .mui-btn-nav {
-webkit-transition: none;
transition: none;
-webkit-transition-duration: .0s;
transition-duration: .0s;
}
.mui-navbar .mui-bar .mui-title {
display: inline-block;
width: auto;
}
.mui-page-shadow {
position: absolute;
right: 100%;
top: 0;
width: 16px;
height: 100%;
z-index: -1;
content: '';
}
.mui-page-shadow {
background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
background: linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
}
.mui-navbar-inner.mui-transitioning,
.mui-navbar-inner .mui-transitioning {
-webkit-transition: opacity 300ms ease, -webkit-transform 300ms ease;
transition: opacity 300ms ease, transform 300ms ease;
}
.mui-page {
display: none;
}
.mui-pages .mui-page {
display: block;
}
.mui-page .mui-table-view:first-child {
margin-top: 15px;
}
.mui-page .mui-table-view:last-child {
margin-bottom: 30px;
}
.mui-table-view {
margin-top: 20px;
}
.mui-table-view span.mui-pull-right {
color: #999;
}
.mui-table-view-divider {
background-color: #efeff4;
font-size: 14px;
}
.mui-table-view-divider:before,
.mui-table-view-divider:after {
height: 0;
}
.head {
height: 40px;
}
#head {
line-height: 40px;
}
.head-img {
width: 40px;
height: 40px;
}
#head-img1 {
position: absolute;
bottom: 10px;
right: 40px;
width: 40px;
height: 40px;
}
.update {
font-style: normal;
color: #999999;
margin-right: -25px;
font-size: 15px
}
.mui-fullscreen {
position: fixed;
z-index: 20;
background-color: #000;
}
.mui-ios .mui-navbar .mui-bar .mui-title {
position: static;
}
/*问题反馈在setting页面单独的css*/
#feedback .mui-popover{
position: fixed;
}
#feedback .mui-table-view:last-child {
margin-bottom: 0px;
}
#feedback .mui-table-view:first-child {
margin-top: 0px;
}
.radius {
width: 35px;
height: 35px;
line-height: 35px;
margin-right: 20px;
text-align: center;
border-radius: 30px;
font-size: 14px;
}
.bcred {
background-color: #006741;
color: #F2F2F2;
font-weight: bold;
}
.bcblue {
background-color: #EC971F;
color: #F2F2F2;
font-weight: bold;
}
.mui-media-body {
height: 35px;
line-height: 35px;
}
.fgray {
color: #ACACB4;
font-size: 16px;
}
.agree {
font-size: 14px;
}
.mui-popup-text{
height:200px;
overflow-y: auto;
}
.setTime{
padding-right:20px;
}
.setsendTimetitle{
margin-left:20px;
}
</style>
</head>
<body class="mui-fullscreen">
<!--页面主结构开始-->
<div id="app" class="mui-views">
<div class="mui-view">
<div class="mui-navbar">
</div>
<div class="mui-pages">
</div>
</div>
</div>
<!--页面主结构结束-->
<!--单页面开始-->
<div id="setting" class="mui-page">
<!--页面标题栏开始-->
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<h1 class="mui-center mui-title">上门取件</h1>
</div>
<!--页面标题栏结束-->
<!--页面主内容区开始-->
<div class="mui-page-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<form id='login-form' class="mui-input-group" >
<ul class="mui-table-view">
<li class="mui-table-view-cell mui-media">
<a href="#address" class="mui-navigate-right" id="address1">
<div class="mui-pull-left radius bcred">寄</div>
<div class="mui-media-body fgray">
请选择寄件地址
</div>
</a>
</li>
<li class="mui-table-view-cell mui-media">
<a href="#address" class="mui-navigate-right" id="address2">
<div class="mui-pull-left radius bcblue">收</div>
<div class="mui-media-body fgray">
请选择收件地址
</div>
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" id="setsendTime">
<div class="mui-pull-left setsendTimetitle">收件时间</div>
<div class="mui-pull-right setTime" id="sendTime">
1小时以内
</div>
</a>
</li>
</ul>
</form>
<form class="mui-input-group" style="margin-bottom: 15px;">
<div class="mui-input-row mui-radio mui-right">
<label>常规件</label>
<input name="radio1" type="radio" >
</div>
<div class="mui-input-row mui-radio mui-right">
<label>大件</label>
<input name="radio1" type="radio" checked>
</div>
</form>
<form class="mui-input-group" >
<div class="mui-input-row">
<label>费用</label>
<input type="text" id="cose" style="text-align:right;" readonly="readonly" value="8.5元">
</div>
</form>
<br/>
<div class="mui-input-row">
<button id='login' class="mui-btn mui-btn-block mui-btn-primary" style="width:100%">支付</button>
</div>
<div class="mui-input-row mui-checkbox mui-text-center">
<label class="agree">提交即同意<a id="alertMessage">《快递运单契约条款》</a></label>
<!--<input id="agree" name="checkbox1" value="Item 1" type="checkbox">-->
</div>
</div>
</div>
</div>
</div>
<!--页面主内容区结束-->
<div id="address" class="mui-page">
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
<span class="mui-icon mui-icon-left-nav"></span>返回
</button>
<h1 class="mui-center mui-title">地址管理</h1>
</div>
<div class="mui-page-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<div style="padding: 10px 10px;">
<div id="segmentedControl" class="mui-segmented-control">
<a class="mui-control-item mui-active" href="#item1" id="addtab1">寄件人地址</a>
<a class="mui-control-item" href="#item2" id="addtab2">收件人地址</a>
</div>
</div>
<div>
<div id="item1" class="mui-control-content mui-active">
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
</ul>
</div>
<div id="item2" class="mui-control-content">
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-8">
<h4 class="mui-ellipsis">王明阳</h4>
</div>
<div class="mui-table-cell mui-col-xs-4 mui-text-right">
<span class="mui-h5">18721037940</span>
</div>
</div>
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-12">
<p class="mui-h6 mui-ellipsis">Hi,李明明,申请交行信息卡,100元等你拿,李明明,申请交行信息卡,100元等你拿,</p>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="js/mui.min.js"></script>
<script src="js/mui.view.js"></script>
<script src="js/mui.picker.min.js"></script>
<script src="js/sendTime.data.js"></script>
<script>
mui.init({
swipeBack: true //启用右滑关闭功能
});
//初始化单页view
var viewApi = mui('#app').view({
defaultPage: '#setting'
});
//初始化单页的区域滚动
mui('.mui-scroll-wrapper').scroll();
document.getElementById("alertMessage").addEventListener('tap', function() {
mui.alert('Hello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUIHello MUI', '快递服务协议', function() {
//info.innerText = '你刚关闭了警告框';
});
});
document.getElementById("address1").addEventListener('tap', function() {
document.getElementById("item1").classList.add("mui-active");
document.getElementById("item2").classList.remove("mui-active");
document.getElementById("addtab1").classList.add("mui-active");
document.getElementById("addtab2").classList.remove("mui-active");
});
document.getElementById("address2").addEventListener('tap', function() {
document.getElementById("item1").classList.remove("mui-active");
document.getElementById("item2").classList.add("mui-active");
document.getElementById("addtab1").classList.remove("mui-active");
document.getElementById("addtab2").classList.add("mui-active");
});
(function($,doc) {
//处理view的后退与webview后退
var oldBack = $.back;
$.back = function() {
if (viewApi.canBack()) { //如果view可以后退,则执行view的后退
viewApi.back();
} else { //执行webview后退
oldBack();
}
};
var cityPicker = new mui.PopPicker({
layer: 2
});
cityPicker.setData(sendTime);
var sendTimeObj = doc.getElementById('sendTime');
document.getElementById("setsendTime").addEventListener('tap', function(event) {
cityPicker.show(function(items) {
sendTimeObj.innerText = items[0].text + " " + items[1].text;
//返回 false 可以阻止选择框的关闭
//return false;
});
});
})(mui,document);
</script>
</html>