Blog.csdn.net/hanhanwangh… Treasure Girl welcomes your attention! Welcome to wechat public account: Treasure girl’s growing diary if reproduced, please indicate the source (if not indicated, the thief will investigate)
This week has been so busy that I didn’t even have time to write in my diary and wash my hair. Fortunately, I have received satisfactory results.
Now to improve the project, ha ha ha, and my little fans together! Go!! The first few parts of the project: Connecting the real phone to develop Android mobile App MUI framework — Hybrid development (I)
Android Mobile App MUI Framework — Hybrid Development (II) Take your Project development (latest version)
Android Mobile App MUI Framework — Hybrid Development (III) (Connecting the back end)
Connect the real phone to develop Android mobile app MUI frame add shopping cart, etc. — Mixed development (IV)
Today’s topic: Rush
- First, improve the shopping cart page
- Ii. Improve continue shopping (button)
- 3. Add the button function to settle accounts
- Iv. Confirm the order
- Display my order
- Exit the system
First, improve the shopping cart page
The original main. HTML
<! DOCTYPEhtml>
<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">
<link rel="stylesheet" href="css/mui.min.css">
<style>
html.body {
background-color: #efeff4;
}
</style>
</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 id="title" class="mui-title">Welcome to the Sweet House</h1>
</header>
<nav class="mui-bar mui-bar-tab">
<a id="defaultTab" class="mui-tab-item mui-active" href="index.html">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">Home page</span>
</a>
<a class="mui-tab-item" href="prolist.html">
<span class="mui-icon mui-icon-email"><span class="mui-badge">9</span></span>
<span class="mui-tab-label">List of goods</span>
</a>
<a class="mui-tab-item" href="car.html">
<span class="mui-icon mui-icon-contact"><span class="mui-badge">9</span></span></span>
<span class="mui-tab-label">The shopping cart</span>
</a>
<a class="mui-tab-item" href="my.html">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">my</span>
</a>
</nav>
<script src="js/mui.min.js"></script>
<script type="text/javascript" charset="utf-8">
/ / 's initialization
mui.init();
var subpages = ['index.html'.'prolist.html'.'car.html'.'my.html'];
var subpage_style = {
top: '45px'.bottom: '51px'
};
var aniShow = {};
// Create a sub-page, the first TAB page is displayed, other hidden;
mui.plusReady(function() {
var self = plus.webview.currentWebview();
for (var i = 0; i < 4; i++) {
var temp = {};
var sub = plus.webview.create(subpages[i], subpages[i], subpage_style);
if (i > 0) {
sub.hide();
}else{
temp[subpages[i]] = "true"; mui.extend(aniShow,temp); } self.append(sub); }});// Currently active options
var activeTab = subpages[0];
var title = document.getElementById("title");
// TAB click events
mui('.mui-bar-tab').on('tap'.'a'.function(e) {
var targetTab = this.getAttribute('href');
if (targetTab == activeTab) {
return;
}
// Change the title
title.innerHTML = this.querySelector('.mui-tab-label').innerHTML;
// Displays the target TAB
// If it is on iOS or not displayed for the first time, it is displayed directly
if(mui.os.ios||aniShow[targetTab]){
plus.webview.show(targetTab);
}else{
// Otherwise, use the fade in animation and save the variables
var temp = {};
temp[targetTab] = "true";
mui.extend(aniShow,temp);
plus.webview.show(targetTab,"fade-in".300);
}
// Hide the current;
plus.webview.hide(activeTab);
// Change the currently active TAB
activeTab = targetTab;
});
// Customize the event by clicking the "home TAB"
document.addEventListener('gohome'.function() {
var defaultTab = document.getElementById("defaultTab");
// simulate home page click
mui.trigger(defaultTab, 'tap');
// Toggle TAB highlighting
var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
if(defaultTab ! == current) { current.classList.remove('mui-active');
defaultTab.classList.add('mui-active'); }});</script>
</body>
</html>
Copy the codeNow we will implement the “click on the cart to jump to the cart page” function
Take the cart id car at line 34
Add custom events
Triggered in proview.html
Now we can go to the shopping cart page by clicking Add Cart in the item details but there is a problem that we need to refresh the shopping cart page so we need to add a refresh event
Add this refresh code to car.html
Write trigger events in proview.html
Ii. Improve continue shopping (button)
The original main. HTML
<! DOCTYPEhtml>
<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">
<link rel="stylesheet" href="css/mui.min.css">
<style>
html.body {
background-color: #efeff4;
}
</style>
</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 id="title" class="mui-title">Welcome to the Sweet House</h1>
</header>
<nav class="mui-bar mui-bar-tab">
<a id="defaultTab" class="mui-tab-item mui-active" href="index.html">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">Home page</span>
</a>
<a class="mui-tab-item" href="prolist.html">
<span class="mui-icon mui-icon-email"><span class="mui-badge">9</span></span>
<span class="mui-tab-label">List of goods</span>
</a>
<a class="mui-tab-item" href="car.html">
<span class="mui-icon mui-icon-contact"></span>
<span class="mui-tab-label">The shopping cart</span>
</a>
<a class="mui-tab-item" href="my.html">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">my</span>
</a>
</nav>
<script src="js/mui.min.js"></script>
<script type="text/javascript" charset="utf-8">
/ / 's initialization
mui.init();
var subpages = ['index.html'.'prolist.html'.'car.html'.'my.html'];
var subpage_style = {
top: '45px'.bottom: '51px'
};
var aniShow = {};
// Create a sub-page, the first TAB page is displayed, other hidden;
mui.plusReady(function() {
var self = plus.webview.currentWebview();
for (var i = 0; i < 4; i++) {
var temp = {};
var sub = plus.webview.create(subpages[i], subpages[i], subpage_style);
if (i > 0) {
sub.hide();
}else{
temp[subpages[i]] = "true"; mui.extend(aniShow,temp); } self.append(sub); }});// Currently active options
var activeTab = subpages[0];
var title = document.getElementById("title");
// TAB click events
mui('.mui-bar-tab').on('tap'.'a'.function(e) {
var targetTab = this.getAttribute('href');
if (targetTab == activeTab) {
return;
}
// Change the title
title.innerHTML = this.querySelector('.mui-tab-label').innerHTML;
// Displays the target TAB
// If it is on iOS or not displayed for the first time, it is displayed directly
if(mui.os.ios||aniShow[targetTab]){
plus.webview.show(targetTab);
}else{
// Otherwise, use the fade in animation and save the variables
var temp = {};
temp[targetTab] = "true";
mui.extend(aniShow,temp);
plus.webview.show(targetTab,"fade-in".300);
}
// Hide the current;
plus.webview.hide(activeTab);
// Change the currently active TAB
activeTab = targetTab;
});
// Customize the event by clicking the "home TAB"
document.addEventListener('gohome'.function() {
var defaultTab = document.getElementById("defaultTab");
// simulate home page click
mui.trigger(defaultTab, 'tap');
// Toggle TAB highlighting
var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
if(defaultTab ! == current) { current.classList.remove('mui-active');
defaultTab.classList.add('mui-active'); }});</script>
</body>
</html>
Copy the codeAdd id proList to main
Add custom events in main.html
Complete the main HTML
<! DOCTYPEhtml>
<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">
<link rel="stylesheet" href="css/mui.min.css">
<style>
html.body {
background-color: #efeff4;
}
</style>
</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 id="title" class="mui-title">Welcome to the Sweet House</h1>
</header>
<nav class="mui-bar mui-bar-tab">
<a id="defaultTab" class="mui-tab-item mui-active" href="index.html">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">Home page</span>
</a>
<a id="prolist" class="mui-tab-item" href="prolist.html">
<span class="mui-icon mui-icon-email"><span class="mui-badge">9</span></span>
<span class="mui-tab-label">List of goods</span>
</a>
<a id="car" class="mui-tab-item" href="car.html">
<span class="mui-icon mui-icon-contact"><span class="mui-badge">9</span></span></span>
<span class="mui-tab-label">The shopping cart</span>
</a>
<a class="mui-tab-item" href="my.html">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">my</span>
</a>
</nav>
<script src="js/mui.min.js"></script>
<script type="text/javascript" charset="utf-8">
/ / 's initialization
mui.init();
var subpages = ['index.html'.'prolist.html'.'car.html'.'my.html'];
var subpage_style = {
top: '45px'.bottom: '51px'
};
var aniShow = {};
// Create a sub-page, the first TAB page is displayed, other hidden;
mui.plusReady(function() {
var self = plus.webview.currentWebview();
for (var i = 0; i < 4; i++) {
var temp = {};
var sub = plus.webview.create(subpages[i], subpages[i], subpage_style);
if (i > 0) {
sub.hide();
}else{
temp[subpages[i]] = "true"; mui.extend(aniShow,temp); } self.append(sub); }});// Currently active options
var activeTab = subpages[0];
var title = document.getElementById("title");
// TAB click events
mui('.mui-bar-tab').on('tap'.'a'.function(e) {
var targetTab = this.getAttribute('href');
if (targetTab == activeTab) {
return;
}
// Change the title
title.innerHTML = this.querySelector('.mui-tab-label').innerHTML;
// Displays the target TAB
// If it is on iOS or not displayed for the first time, it is displayed directly
if(mui.os.ios||aniShow[targetTab]){
plus.webview.show(targetTab);
}else{
// Otherwise, use the fade in animation and save the variables
var temp = {};
temp[targetTab] = "true";
mui.extend(aniShow,temp);
plus.webview.show(targetTab,"fade-in".300);
}
// Hide the current;
plus.webview.hide(activeTab);
// Change the currently active TAB
activeTab = targetTab;
});
// Customize the event by clicking the "home TAB"
document.addEventListener('gohome'.function() {
var defaultTab = document.getElementById("defaultTab");
// simulate home page click
mui.trigger(defaultTab, 'tap');
// Toggle TAB highlighting
var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
if(defaultTab ! == current) { current.classList.remove('mui-active');
defaultTab.classList.add('mui-active'); }});document.addEventListener('goprolist'.function() {
var prolist = document.getElementById("prolist");
// simulate home page click
mui.trigger(prolist, 'tap');
// Toggle TAB highlighting
var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
if(prolist ! == current) { current.classList.remove('mui-active');
prolist.classList.add('mui-active'); }});document.addEventListener('gocar'.function() {
var car = document.getElementById("car");
mui.trigger(car, 'tap');
// Toggle TAB highlighting
var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
if(car ! == current) { current.classList.remove('mui-active');
car.classList.add('mui-active'); }});</script>
</body>
</html>
Copy the codeThere are the following trigger events in car.html
The finished result looks like this
3. Add the button function to settle accounts
The original login. HTML
<! doctypehtml>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
<style type="text/css">
</style>
</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">The login</h1>
</header>
<div class="mui-content">
<form class="mui-input-group">
<div class="mui-input-row">
<label>The user name</label>
<input type="text" id="tbnusername" class="mui-input-clear" value="Jay son" placeholder="Username">
</div>
<div class="mui-input-row">
<label>password</label>
<input type="text" id="tbnpassword" class="mui-input-clear" value="123" placeholder="Password">
</div>
<div class="mui-input-row">
<input value="Login" type="button" class="mui-btn-block" id="btnlogin" />
</div>
<div style="height: 50px; text-align: center; line-height: 50px;">
<span id="btnreg">Registered account</span>
|
<span id="">Forgot password</span>
</div>
</form>
</div>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
document.getElementById("btnreg").addEventListener("tap".function(){
console.log(11);
mui.openWindow({
url:"reg.html".id:"reg.html"
});
});
document.getElementById("btnlogin").addEventListener("tap".function(){
var vusername=document.getElementById("tbnusername").value;
var vpassword=document.getElementById("tbnpassword").value;
var requrl="http://192.168.43.242:8080/SweetyManage/JavaApi";
localStorage.setItem("requrl",requrl);
mui.ajax(requrl,{
data: {rnum:"2".username:vusername,
password:vpassword
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){
console.log(JSON.stringify(data));
if(data==null||data=="")
{
mui.toast("Wrong username or password!");
}
else
{
console.log(data[0].id);
mui.toast("Login successful!");
localStorage.setItem("id",data[0].id);
mui.openWindow({
url:"main.html".id:"main"}); }}}); });</script>
</body>
</html>
Copy the codeBy clicking this button, we can locate the consignee, whose name, phone number and address are required
Add the following three items to login. HTML
After successful login, the current user’s information is saved in localStorage
Complete the login. HTML
<! doctypehtml>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
<style type="text/css">
</style>
</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">The login</h1>
</header>
<div class="mui-content">
<form class="mui-input-group">
<div class="mui-input-row">
<label>The user name</label>
<input type="text" id="tbnusername" class="mui-input-clear" value="Jay son" placeholder="Username">
</div>
<div class="mui-input-row">
<label>password</label>
<input type="text" id="tbnpassword" class="mui-input-clear" value="123" placeholder="Password">
</div>
<div class="mui-input-row">
<input value="Login" type="button" class="mui-btn-block" id="btnlogin" />
</div>
<div style="height: 50px; text-align: center; line-height: 50px;">
<span id="btnreg">Registered account</span>
|
<span id="">Forgot password</span>
</div>
</form>
</div>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
document.getElementById("btnreg").addEventListener("tap".function(){
console.log(11);
mui.openWindow({
url:"reg.html".id:"reg.html"
});
});
document.getElementById("btnlogin").addEventListener("tap".function(){
var vusername=document.getElementById("tbnusername").value;
var vpassword=document.getElementById("tbnpassword").value;
var requrl="http://192.168.43.242:8080/SweetyManage/JavaApi";
localStorage.setItem("requrl",requrl);
mui.ajax(requrl,{
data: {rnum:"2".username:vusername,
password:vpassword
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){
console.log(JSON.stringify(data));
if(data==null||data=="")
{
mui.toast("Wrong username or password!");
}
else
{
console.log(data[0]);
mui.toast("Login successful!");
localStorage.setItem("id",data[0].id);
localStorage.setItem("truename",data[0].truename);
localStorage.setItem("tel",data[0].tel);
localStorage.setItem("address",data[0].address);
// After successful login, the current person's information is saved in localStorage
mui.openWindow({
url:"main.html".id:"main.html"}); }}}); });</script>
</body>
</html>
Copy the codeAdd id= “gotopay” to car.html
Bind the ID in car.html
This means that the user puts something into a form, and we get what the user fills in based on the ID field
car.html
(dg Press Enter) Get the value from localStorage and display it in the page
In this way, the consignee, telephone number and address can be displayed
Iv. Confirm the order
Set id= gotoOrder in car.html
car.html
The following code means
Get four data at the front end according to the order
Send to the back end
I’m going to tell you what rnum isThe back-endThe code to see JavaApi
First see the name (this is why the name need to pay special attention to, to take the naming of a people can read, your mind is varied, maybe one day you change your mind, don’t know what you write their own, unless you’re playing annotation ha ha ha a a dozen), point to look in the eyes, Go To — “Declaration or Lead Lead on The Performance of the Movie.
Car. HTML complete code
<! doctypehtml>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
<style type="text/css">
#listbox{
background-color: #fff;
}
#listbox ul{
list-style: none;
}
#listbox ul li{
height: 80px;
border-bottom: solid 1px #eee;
position: relative;
}
#listbox ul li img.propic{
width:70px;
height:70px;
float: left;
}
#listbox ul li span{
display: block;
border: solid 1px #eee;
width:28px;
height:28px;
text-align: center;
line-height:28px;
float: left;
}
.btnbox{
width: 90px;
height: 30px;
position: absolute;
right: 5px;
top:20px;
}
.hidden{
display: none;
}
.show{
display: block;
}
</style>
</head>
<body>
<div class="mui-content">
<div id="listbox">
<ul id="itembox">
<! --<li> <img src="img/gou.png" class="propic"/> <p style="padding-top: 15px;" > 5 g huawei mobile phone < / p > < p > $5888.00 < / p > < div class = "btnbox" > < span > - < / span > < span > 1 < / span > < span > + < / span > < / div > < / li > -- >
</ul>
<p style="padding-left: 50px; padding-bottom: 20px;">The total price:<span id="pricebox"></span></p>
</div>
<button type="button" class="mui-btn mui-btn-blue mui-btn-block" id="gotoprolist">To continue shopping</button>
<button type="button" class="mui-btn mui-btn-blue mui-btn-block" id="gotopay">To settle accounts</button>
<div id="userinfobox" class="hidden">
<form class="mui-input-group">
<div class="mui-input-row">
<label>The consignee</label>
<input type="text" id="tbtruename" class="mui-input-clear" placeholder="Consignee">
</div>
<div class="mui-input-row">
<label>The phone</label>
<input type="text" id="tbtel" class="mui-input-clear" placeholder="Telephone">
</div>
<div class="mui-input-row">
<label>address</label>
<input type="text" id="tbaddress" class="mui-input-clear" placeholder="Address">
</div>
</form>
<button type="button" id="gotoorder" class="mui-btn mui-btn-blue mui-btn-block">Confirm the order</button>
</div>
</div>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
mui.ready(function(){
cardatainit();
});
document.getElementById("gotoorder").addEventListener("tap".function(){
var truename=document.getElementById("tbtruename").value;
var tel=document.getElementById("tbtel").value;
var address=document.getElementById("tbaddress").value;
var userid=localStorage.getItem("id");
var requrl=localStorage.getItem("requrl");
mui.ajax(requrl,{
data: {rnum:"9".userid:userid,
tbname:truename,
tbaddress:address,
tbtel:tel
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){
mui.toast("Order successful!");
mui.openWindow({
url:"myorderlist.html".id:"myorderlist.html"}); }}); });// Initialize the data in the cart
function cardatainit()
{
// Query the items added to the shopping cart by the current app user. Bind the queried data to UL.
// Required parameter: userid
var requrl=localStorage.getItem("requrl");
var userid=localStorage.getItem("id");
/* 
5 g huawei mobile phone < / p > < p > $5888.00 < / p > < div class = "btnbox" > < span > - < / span > < span > 1 < / span > < span > + < / span > < / div > < / li > * /
mui.ajax(requrl,{
data: {rnum:"6".userid:userid
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){
console.log(JSON.stringify(data));
var htmlstr="";
var sumprice=0;
for (var i=0; i<data.length; i++) { htmlstr+='<li>';
htmlstr+='< img SRC = "http://192.168.43.242:8080/SweetyManage/upload/"+data[i].imgurl+'" class="propic"/>';
htmlstr+=' '
+data[i].proname+'</p>';
htmlstr+='< p > $'+data[i].price+'.00</p>';
htmlstr+='<div class="btnbox" id="'+data[i].proid+'"><span class="btnjian">-</span><span class="numberbox">'+data[i].procount+'</span><span class="btnjia">+</span></div>';
htmlstr+="</li>";
sumprice +=parseInt(data[i].price)*parseInt(data[i].procount);// Unit price * quantity = subtotal then add up the prices of all items by summing them up and save them in sumprice. Note here that both unit price and quantity should be converted into numbers before calculating the price.
}
document.getElementById("pricebox").innerText=sumprice;
document.getElementById("itembox").innerHTML=htmlstr; }}); }// Bind the click event to the add button by delegate
mui("#itembox").on("tap"."span.btnjia".function(){
var proid=this.parentNode.getAttribute("id");
var userid=localStorage.getItem("id");
var v=this.parentNode.querySelector(".numberbox").innerText;// Get the number of items in the cart
v=parseInt(v);
v=v+1;
var requrl=localStorage.getItem("requrl");
mui.ajax(requrl,{
data: {rnum:"8".userid:userid,
id:proid,
countvalue:v
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){ cardatainit(); }}); }); mui("#itembox").on("tap"."span.btnjian".function(){
var proid=this.parentNode.getAttribute("id");
var userid=localStorage.getItem("id");
var v=this.parentNode.querySelector(".numberbox").innerText;// Get the number of items in the cart
v=parseInt(v);
v=v-1;
var requrl=localStorage.getItem("requrl");
if(v<1)
{
// If the number of items in the cart is less than 1, delete the item
mui.ajax(requrl,{
data: {rnum:"Seven".userid:userid,
id:proid
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){
if(data.msg=="ok")
{
mui.toast("Delete successful!"); } cardatainit(); }}); }else
{
// If the quantity of the item is not less than 1, just reduce the quantity of the item by 1.
mui.ajax(requrl,{
data: {rnum:"8".userid:userid,
id:proid,
countvalue:v
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){ cardatainit(); }}); }});// Click the go to settlement button
document.getElementById("gotopay").addEventListener("tap".function(){
document.getElementById("tbtruename").value=localStorage.getItem('truename');
document.getElementById("tbtel").value=localStorage.getItem('tel');
document.getElementById("tbaddress").value=localStorage.getItem('address');
document.getElementById("userinfobox").className="show";
});
// Click the continue shopping button
document.getElementById("gotoprolist").addEventListener("tap".function(){
var main=plus.webview.getWebviewById("main.html");
mui.fire(main,'goprolist');
});
// Custom events that trigger refresh of shopping cart list data on other pages
document.addEventListener('initdata'.function() {
cardatainit();
});
</script>
</body>
</html>
Copy the code
So I’ve done the comments on the back end
Javaapi.java (back end interface) back end code about the order here I have written a comment
package com.rz;
import java.io.IOException;
import java.sql.SQLException;
import java.text.SimpleDateFormat;
import java.util.*;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.alibaba.fastjson.JSON;
/** * Servlet implementation class JavaApi */
@WebServlet(name="JavaApi",value="/JavaApi")
public class JavaApi extends HttpServlet {
private static final long serialVersionUID = 1L;
/ * * *@see HttpServlet#HttpServlet()
*/
public JavaApi(a) {
super(a);// TODO Auto-generated constructor stub
}
/ * * *@see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request,response);
}
/ * * *@see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
String rnum=request.getParameter("rnum");
response.setCharacterEncoding("utf-8");
response.setContentType("text/json; charset=utf-8");
response.setHeader("Access-Control-Allow-Origin"."*");
response.setHeader("Access-Control-Allow-Methods"."PUT, GET, POST, DELETE, OPTIONS");
response.setHeader("Access-Control-Allow-Headers"."X-Requested-With");
response.setHeader("Access-Control-Allow-Headers"."Content-Type");
System.out.print(rnum);
if(rnum! =null)
{
switch(rnum)
{
case "1":userreg(request,response);break;
case "2":userlogin(request,response);break;
case "3":getprolist(request,response);break;
case "4":getprobyid(request,response);break;
case "5":addtocar(request,response);break;
case "6":getcarlist(request,response);break;
case "Seven":deleteCarPro(request,response);break;
case "8":updateCarCount(request,response);break;
case "9":addToOrder(request,response);break;
case "10":getorderlist(request,response);break;
case "11":getOrderView(request,response);break; }}else {
response.getWriter().write("{\"result\":\"nodata\"}"); }}// User registration
protected void userreg(HttpServletRequest request, HttpServletResponse response) throws IOException
{
String username=request.getParameter("username");
String password=request.getParameter("password");
String truename=request.getParameter("truename");
String tel=request.getParameter("tel");
String address=request.getParameter("address");
String StrSql1="insert into tbmember (username,password,truename,tel,address) values (? ,? ,? ,? ,?) ";
List<Object> params1 = new ArrayList<Object>();
params1.add(username);
params1.add(password);
params1.add(truename);
params1.add(tel);
params1.add(address);
DBHelper Dal=new DBHelper();
Dal.excuteSql(StrSql1, params1);
response.setCharacterEncoding("utf-8");
response.setContentType("text/json; charset=utf-8");
response.getWriter().write("{\"msg\":\"ok\"}");
}
// User login
protected void userlogin(HttpServletRequest request, HttpServletResponse response) throws IOException
{
String username=request.getParameter("username");
String password=request.getParameter("password");
DBHelper Dal=new DBHelper();
String strSql=" select * from tbmember where username=? and password=? ";
List<Object> params = new ArrayList<Object>();
params.add(username);
params.add(password);
List<Map<String, Object>> userlist = null;
try {
userlist=Dal.executeQuery(strSql, params);
} catch (SQLException e) {
e.printStackTrace();
}
String jsonstr =JSON.toJSONString(userlist);
response.setCharacterEncoding("utf-8");
response.setContentType("text/json; charset=utf-8");
response.getWriter().write(jsonstr);
}
// Get the list of items
protected void getprolist(HttpServletRequest request, HttpServletResponse response) throws IOException
{
DBHelper Dal=new DBHelper();
String strSqlpager=" select * from tbproduct order by id desc";
List<Map<String, Object>> listpage = null;
try {
List<Object> params = new ArrayList<Object>();
listpage=Dal.executeQuery(strSqlpager, params);
String jsonstr =JSON.toJSONString(listpage);
response.getWriter().write(jsonstr);
} catch(SQLException e) { e.printStackTrace(); }}// Obtain the item details based on the item ID
protected void getprobyid(HttpServletRequest request, HttpServletResponse response) throws IOException
{
DBHelper Dal=new DBHelper();
String id=request.getParameter("id");
String strSqlpager=" select * from tbproduct where id=? ";
Map<String, Object> objectbyid = null;
List<Object> params = new ArrayList<Object>();
params.add(id);
objectbyid=Dal.getSingleObject(strSqlpager, params);
String jsonstr =JSON.toJSONString(objectbyid);
response.getWriter().write(jsonstr);
}
// Get the list of items on the home page
protected void getindexproindexlist(HttpServletRequest request, HttpServletResponse response) throws IOException
{
DBHelper Dal=new DBHelper();
String strSqlpager="Select * from tbproduct order by id desc limit 0,4";
List<Map<String, Object>> listpage = null;
try {
List<Object> params = new ArrayList<Object>();
listpage=Dal.executeQuery(strSqlpager, params);
String jsonstr =JSON.toJSONString(listpage);
response.getWriter().write(jsonstr);
} catch(SQLException e) { e.printStackTrace(); }}// Add to cart
protected void addtocar(HttpServletRequest request, HttpServletResponse response) throws IOException
{
String proid=request.getParameter("proid");
String userid=request.getParameter("userid");
DBHelper db=new DBHelper();
Boolean flag=false;
String StrSqlexist="select * from tbshoppingcar where userid=? and proid=? ";
List<Map<String, Object>> carrecordlist = null;
List<Object> paramsexist = new ArrayList<Object>();
paramsexist.add(userid);
paramsexist.add(proid);
try {
carrecordlist=db.executeQuery(StrSqlexist, paramsexist);
} catch (SQLException e) {
e.printStackTrace();
}
if(carrecordlist.size()>0)
{
flag=true;
}
if(flag)
{
// Change the number
String strSql1="update tbshoppingcar set procount=procount+1 where userid=? and proid=? ";
List<Object> paramsupdate = new ArrayList<Object>();
paramsupdate.add(userid);
paramsupdate.add(proid);
db.excuteSql(strSql1, paramsupdate);
}
else
{
// Query the product information according to the id.
List<Object> params = new ArrayList<Object>();
String StrSqlpro="select * from tbproduct where id="+proid;
Map<String, Object> obj=db.getSingleObject(StrSqlpro, params);
SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");// Set the date format
String createtime=df.format(new Date());
/ / new
String strSql2="insert into tbshoppingcar (userid,proname,proid,procount,ctime,imgurl,price) values(? ,? ,? ,? ,? ,? ,?) ";
params.add(userid);
params.add(obj.get("proname"));
params.add(proid);
params.add(1);
params.add(createtime);
params.add(obj.get("imgurl"));
params.add(obj.get("price"));
db.excuteSql(strSql2, params);
}
response.setCharacterEncoding("utf-8");
response.setContentType("text/json; charset=utf-8");
response.getWriter().write("{\"msg\":\"ok\"}");
}
// Get the list of cart items
protected void getcarlist(HttpServletRequest request, HttpServletResponse response) throws IOException
{
String userid=request.getParameter("userid");
List<Map<String, Object>> carlistall = null;
List<Object> params2 = new ArrayList<Object>();
DBHelper Dal=new DBHelper();
String strSqlpager=" select * from tbshoppingcar where userid=? ";
params2.add(userid);
try {
carlistall=Dal.executeQuery(strSqlpager, params2);
String jsonstr =JSON.toJSONString(carlistall);
response.getWriter().write(jsonstr);
} catch(SQLException e) { e.printStackTrace(); }}// Delete the cart item
protected void deleteCarPro(HttpServletRequest request, HttpServletResponse response) throws IOException
{
String id=request.getParameter("id");
String userid=request.getParameter("userid");
String strSql="delete from tbshoppingcar where userid=? and proid=? ";
DBHelper db=new DBHelper();
List<Object> params = new ArrayList<Object>();
params.add(userid);
params.add(id);
db.excuteSql(strSql, params);
response.setCharacterEncoding("utf-8");
response.setContentType("text/json; charset=utf-8");
response.getWriter().write("{\"msg\":\"ok\"}");
}
// Modify the number of shopping carts
protected void updateCarCount(HttpServletRequest request, HttpServletResponse response) throws IOException
{
String id=request.getParameter("id");
String countvalue=request.getParameter("countvalue");
String userid=request.getParameter("userid");
String strSql="update tbshoppingcar set procount=? where userid=? and proid=? ";
DBHelper db=new DBHelper();
List<Object> params = new ArrayList<Object>();
params.add(countvalue);
params.add(userid);
params.add(id);
db.excuteSql(strSql, params);
response.setCharacterEncoding("utf-8");
response.setContentType("text/json; charset=utf-8");
response.getWriter().write("{\"msg\":\"ok\"}");
}
// Single interface
protected void addToOrder(HttpServletRequest request, HttpServletResponse response) throws IOException
{
// Accept arguments from the mobile
Map<String, Object> obj=(Map<String,Object>)request.getSession().getAttribute("currentuser");
String tbname=request.getParameter("tbname");
String tbtel=request.getParameter("tbtel");
String tbaddress=request.getParameter("tbaddress");
String userid=request.getParameter("userid");
// Query the items added to the current person's shopping cart
String strSqlcarpros="select * from tbshoppingcar where userid=? ";
// Define a parameter object
DBHelper db=new DBHelper();
// Define a container to hold the results of the query
List<Object> params = new ArrayList<Object>();
params.add(userid);
List<Map<String,Object>> carprolist=null;
try {
carprolist=db.executeQuery(strSqlcarpros,params);
} catch (SQLException e) {
e.printStackTrace();
}
//If: Check whether the current person has added items to the shopping cart, If not, return nothing
if(! (carprolist.size()>0))
{
return;
}
// Prepare to generate an order number based on the current system time
//New a time object, mainly used to get the current system time
Date t=new Date();
// Next, define two formats to display the time
SimpleDateFormat df1 = new SimpleDateFormat("yyyyMMddHHmmssSSS");
SimpleDateFormat df2 = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
// Use these two formats to format the current system time
String orderid=df1.format(t);
String createtime=df2.format(t);
The sum variable is used to calculate the total price of the order
int sum=0;
// The for loop iterates through the items added by the current user, inserting one piece of data into the order list each time
for (Map<String, Object> m : carprolist) {
// Summing up subtotals for each item subtotals = unit price * quantity. Add up the subtotals for each item and you get the total for all items, which is the total price of the order
//Sum= unit price * quantity = Sum of the current item
sum=sum+Integer.parseInt(m.get("price").toString())*Integer.parseInt(m.get("procount").toString());
// Insert the items from the shopping cart into the order list
String strSqlitems="insert into tborderitems (orderid,proid,proname,price,procount,imgurl) values (? ,? ,? ,? ,? ,?) ";
List<Object> paramsitems = new ArrayList<Object>();
paramsitems.add(orderid);
paramsitems.add(m.get("proid"));
paramsitems.add(m.get("proname"));
paramsitems.add(m.get("price"));
paramsitems.add(m.get("procount"));
paramsitems.add(m.get("imgurl"));
db.excuteSql(strSqlitems, paramsitems);
}
// Insert the order's consignee information into the order header table
String StrSql1="insert into tborderhead (orderid,sname,stel,saddress,sumprice,memberid,ctime) values (? ,? ,? ,? ,? ,? ,?) ";
List<Object> params1 = new ArrayList<Object>();
params1.add(orderid);
params1.add(tbname);
params1.add(tbtel);
params1.add(tbaddress);
params1.add(sum);
params1.add(userid);
params1.add(createtime);
db.excuteSql(StrSql1, params1);
// Empty the cart after placing the order. Remove items that the current person has added to the cart
String strSqlClearCar="delete from tbshoppingcar where sessionid=?";
db.excuteSql(strSqlClearCar, params);
// Tell the mobile terminal that the operation is complete
response.setCharacterEncoding("utf-8");
response.setContentType("text/json; charset=utf-8");
response.getWriter().write("{\"msg\":\"ok\"}");
}
// Get the order list
protected void getorderlist(HttpServletRequest request, HttpServletResponse response) throws IOException
{
DBHelper Dal=new DBHelper();
String currentid=request.getParameter("currentid");
String strSqlpager=" select * from v_order where memberid=? order by id desc";
List<Map<String, Object>> listpage = null;
try {
List<Object> params = new ArrayList<Object>();
params.add(currentid);
listpage=Dal.executeQuery(strSqlpager, params);
String jsonstr =JSON.toJSONString(listpage);
response.getWriter().write(jsonstr);
} catch(SQLException e) { e.printStackTrace(); }}// Get the order details
protected void getOrderView(HttpServletRequest request, HttpServletResponse response) throws IOException
{
String orderid=request.getParameter("orderid");
DBHelper Dal=new DBHelper();
String strSql1=" select * from tborderhead where orderid=? ";
Map<String, Object> objbyid = null;
List<Object> params = new ArrayList<Object>();
params.add(orderid);
objbyid=Dal.getSingleObject(strSql1, params);
String strSql2=" select * from tborderitems where orderid=? ";
List<Map<String,Object>> listitems=new ArrayList<Map<String, Object>>();
try {
listitems=Dal.executeQuery(strSql2, params);
} catch (SQLException e) {
e.printStackTrace();
}
Map<String, Object> map = new HashMap<String, Object>();
map.put("orderhead", objbyid);
map.put("orderitems", listitems);
String jsonstr =JSON.toJSONString(map);
response.getWriter().write(jsonstr);
}
// Get the news list
protected void getNewsList(HttpServletRequest request, HttpServletResponse response) throws IOException
{
int currentpage=1;
int pagesize=10;
try
{
String p=request.getParameter("p");
currentpage = Integer.valueOf(p);
}
catch(Exception e){
currentpage=1;
}
DBHelper Dal=new DBHelper();
// query all
String strSql=" select id from tbnews order by id desc ";
List<Map<String, Object>> listall = null;
List<Object> params = new ArrayList<Object>();
try {
listall=Dal.executeQuery(strSql, params);
} catch (SQLException e) {
e.printStackTrace();
}
// paging query
int startindex=pagesize*(currentpage-1);
String strSqlpager=" select * from tbnews order by id desc limit "+startindex+","+pagesize+"";
List<Map<String, Object>> listpage = null;
try {
listpage=Dal.executeQuery(strSqlpager, params);
String jsonstr =JSON.toJSONString(listpage);
response.getWriter().write(jsonstr);
} catch(SQLException e) { e.printStackTrace(); }}}Copy the codeDisplay my order
One thing to be clear about here is that there are two tables
- Header table (the last two fields are used for time and remarks)
Consignee and total price
That’s what it looks like in the database
- Order sheet
Order Number Order Name Price and Quantity
That’s what it looks like in the database
Click OK to place myorder and go to myorder page. Create myOrderList.html (MUI framework) myOrderList.html
<! doctypehtml>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
</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">My order</h1>
</header>
<div class="mui-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<div style="height: 50px;"></div>
<div id="orderlistbox">
</div>
</div>
</div>
</div>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
mui('.mui-scroll-wrapper').scroll({
indicators: false.// Whether to display a scroll bar
deceleration:0.00006.// Damping coefficient, the smaller the coefficient, the more sensitive the slide
bounce: true // Whether to enable springback
});
/*
2016-06-30 15:30
< P > Consignee: Zhang SAN
Tel: 15366665555
Address:
mui.ready(function(){
var requrl=localStorage.getItem("requrl");
var currentuserid=localStorage.getItem("id");
console.log(currentuserid);
mui.ajax(requrl,{
data: {rnum:"10".currentid:currentuserid,
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){
console.log(JSON.stringify(data));
var orderhtml="";
for (var i=0; i<data.length; i++) { orderhtml+='<div class="mui-card" id="'+data[i].orderid+'" >';
orderhtml+='<div class="mui-card-header mui-card-media">';
orderhtml+='<img src="imgs/sweety.png" />';
orderhtml+='<div class="mui-media-body">';
orderhtml+='Order No. :'+data[i].orderid;
orderhtml+=' Order time: '
+data[i].ctime+'</p>';
orderhtml+='</div>';
orderhtml+='</div>';
orderhtml+='<div class="mui-card-content" >';
orderhtml+='
'
;
orderhtml+=' Consignee: '
+data[i].sname+'</p>';
orderhtml+=' Phone: '
+data[i].stel+'</p>';
orderhtml+=' Address: '
+data[i].saddress+' ';
orderhtml+='</div>';
orderhtml+='</div>';
orderhtml+='<div class="mui-card-footer">';
orderhtml+='+data[i].sumprice+'.00</a>';
orderhtml+=';
orderhtml+='</div>';
orderhtml+='</div> ';
}
document.getElementById("orderlistbox").innerHTML=orderhtml; }}); }); mui("#orderlistbox").on("tap"."div.mui-card".function(){
var orderid=this.getAttribute("id");
mui.openWindow({
url:"myorderview.html".id:"myorderview.html".extras: {orderid:orderid
}
});
});
</script>
</body>
</html>
Copy the codemyorderview.html
<! doctypehtml>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />.
<style type="text/css">
p.title{
height:26px;
line-height: 35px;
padding-left: 10px;
}
</style>
</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">The order details</h1>
</header>
<div class="mui-content" style="padding-top: 30px;">
<p class="title">Consignee information</p>
<ul class="mui-table-view">
<li class="mui-table-view-cell">The order no. :<span id="tborderid"></span>
</li>
<li class="mui-table-view-cell">Ordering time:<span id="tbctime"></span>
</li>
<li class="mui-table-view-cell">The consignee:<span id="tbtruename"></span>
</li>
<li class="mui-table-view-cell">Telephone:<span id="tbtel"></span>
</li>
<li class="mui-table-view-cell">Address:<span id="tbaddress"></span>
</li>
<li class="mui-table-view-cell">Price: RMB<span id="tbsumprice"></span>
</li>
</ul>
<p class="title">Goods purchased</p>
<ul class="mui-table-view" id="itemsbox">
</ul>
</div>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
mui.plusReady(function(){
var self = plus.webview.currentWebview();
var orderid=self.orderid;
console.log(orderid);
var requrl=localStorage.getItem("requrl");
mui.ajax(requrl,{
data: {rnum:"11".orderid:orderid
},
dataType:'json'.// The server returns data in JSON format
type:'post'.//HTTP request type
timeout:10000.// Timeout is set to 10 seconds;
headers: {'Content-Type':'application/x-www-form-urlencoded'},
success:function(data){
//console.log(JSON.stringify(data));
console.log(JSON.stringify(data.orderitems))
document.getElementById("tborderid").innerText=data.orderhead.orderid;
document.getElementById("tbctime").innerText=data.orderhead.ctime;
document.getElementById("tbtruename").innerText=data.orderhead.sname;
document.getElementById("tbtel").innerText=data.orderhead.stel;
document.getElementById("tbaddress").innerText=data.orderhead.saddress;
document.getElementById("tbsumprice").innerText=data.orderhead.sumprice;
/* < img class = "mui - media - the object 's - pull - left" SRC = "http://placehold.it/40x30" > < div class = "mui - media - body" > huawei P40 5 g mobile phone < p class = "mui - ellipsis" > 1555.00 x1 < / p > < / div > < / a > < / li > * /
var itemshtml="";
for (var i=0; i<data.orderitems.length; i++) { itemshtml+='<li class="mui-table-view-cell mui-media">';
itemshtml+=' ';
itemshtml+='< img class = "mui - media - the object' s - pull - left" SRC = "http://192.168.43.242:8080/SweetyManage/upload/"+data.orderitems[i].imgurl+'" >';
itemshtml+='<div class="mui-media-body">';
itemshtml+=data.orderitems[i].proname;
itemshtml+='<p class="mui-ellipsis">'+data.orderitems[i].price+'.00x'+data.orderitems[i].procount+'</p>';
itemshtml+=' </div>';
itemshtml+='</a>';
itemshtml+=' ';
}
document.getElementById("itemsbox").innerHTML=itemshtml; }}); });</script>
</body>
</html>
Copy the codeAdd my order id to my.html as btngoToOrderList
Then add dg(Enter), bind the click event, and click my – to jump to my order details page
demo
The data has been received in my background management system
Exit the system
Set id= ‘btnlogout’
my.html
Add click event my.html
my.html
<! doctypehtml>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
</head>
<body>
<div class="mui-content">
<ul class="mui-table-view">
<li id="btngotoorderlist" class="mui-table-view-cell">
<a class="mui-navigate-right">My order</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">Change the password</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">feedback</a>
</li>
<li class="mui-table-view-cell" id='btnaboutUs'>
<a class="mui-navigate-right">About us</a>
</li>
<li class="mui-table-view-cell" id="btnlogout">
<a class="mui-navigate-right">Log out</a>
</li>
</ul>
</div>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init()
document.getElementById("btnaboutUs").addEventListener("tap".function(){
var webview = mui.openWindow({
url:'aboutUs.html'.extras: {name:'wangtiantian' , // Extend parameters
time:'2020-11-4'}});// console.log("123") is used to debug code
})
document.getElementById("btngotoorderlist").addEventListener("tap".function(){
mui.openWindow({
url:"myorderlist.html".id:"myorderlist.html"
});
});
document.getElementById("btnlogout").addEventListener("tap".function(){
localStorage.removeItem("id");
localStorage.removeItem("truename");
localStorage.removeItem("address");
localStorage.removeItem("tel");
mui.openWindow({
url:"login.html".id:"login.html"
});
});
</script>
</body>
</html>
Copy the codeThis is so easy that I don’t need to show you hahaha
Wow, you’ve seen it coming. It’s not normal hahaha! Here said an error hahaha (most people will have this situation, yesterday I ran the back-end program, reported this error) thought for a long time did not think out, the result is the database service did not open, hahaha hahaha, this low-level error.
I hope you and I can always walk on the road of dreams, even in the trough, but also do not forget to move forward