APPCAN页面传值,有三种方法,但是总觉得前两种建立接口监听的方法不好使。
感觉最好使的还是本地存储的方法。
总的流程是从solve_content.html----------->detail.html页面。下边分别是solve_content.html页面和detail.html页面。
<!DOCTYPE html>
<html class="um landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" href="css/fonts/font-awesome.min.css">
<link rel="stylesheet" href="css/ui-box.css">
<link rel="stylesheet" href="css/ui-base.css">
<link rel="stylesheet" href="css/ui-color.css">
<link rel="stylesheet" href="css/appcan.icon.css">
<link rel="stylesheet" href="css/appcan.control.css">
<style type="text/css">
.div {
width: 100%;
height: 5em;
background-color: red;
margin-top: 0.1em
}
</style>
</head>
<body class="um-vp bc-bg" ontouchstart>
<div id="listview" class="ubt bc-border sc-bg">
<div id="ul" >
<img src=""/>
</div>
</div>
<script src="js/appcan.js"></script>
<script src="js/appcan.control.js"></script>
<script src="js/appcan.listview.js"></script>
</body>
<script>
appcan.ready(function() {
appcan.initBounce();
appcan.request.ajax({
url : "http://127.0.0.1/Sever/texst/index.php/Select/select", //encodeURI(JSON.stringify(dengjiTypeName))
type : 'GET',
dataType : 'json',
success : function(data, status, xhr) {
showDataList(data)
},
error : function(xhr, status, errMessage) {
alert("获取数据失败,请检查您的网络");
}
});
})
var ul = document.getElementById('ul');
//数据绑定
function showDataList(data) {
for (var a in data) {
var tmpl = '<div class="div" iid="' + data[a].OITaskID + '" ><img src="http://127.0.0.1/Sever/texst/uploadimg/1444724851.png" style="height: 4em;width:6em;margin-top: 0.5em"/>' + data[a].OITaskID + '-' + data[a].IPlace + '</div>';
ul.innerHTML += tmpl;
}
click();
}
function click() {
var odiv = document.getElementsByClassName('div');
//console.log(odiv.length);
for (var a = 0; a <= odiv.length; a++) {
odiv[a].onclick = function() {
var id = this.getAttribute('iid');
localStorage.setItem("id", id);
//var se = localStorage.getItem("id");
appcan.window.open({
name : "detail",
data : "detail.html",
dataType : "0",
aniId : "1",
type : "0",
width : "",
height : "",
animDuration : ""
})
}
}
}
</script>
</html>
下边是detail.html页面:
<!DOCTYPE html>
<html class="um landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" href="css/fonts/font-awesome.min.css">
<link rel="stylesheet" href="css/ui-box.css">
<link rel="stylesheet" href="css/ui-base.css">
<link rel="stylesheet" href="css/ui-color.css">
<link rel="stylesheet" href="css/appcan.icon.css">
<link rel="stylesheet" href="css/appcan.control.css">
</head>
<body class="um-vp " ontouchstart>
<div id="page_0" class="up ub ub-ver bc-bg" tabindex="0">
<!--header开始-->
<div id="header" class="uh bc-text-head ub bc-head">
<div class="nav-btn" id="nav-left"></div>
<h1 id="h1" class="ut ub-f1 ulev-3 ut-s tx-c" tabindex="0"></h1>
<div class="nav-btn nav-bt" id="nav-right"></div>
</div>
<!--header结束--><!--content开始-->
<div id="content" class="ub-f1 tx-l">
</div>
<!--content结束-->
</div>
<script src="js/appcan.js"></script>
<script src="js/appcan.control.js"></script>
</body>
<script>
appcan.ready(function() {
var titHeight = $('#header').offset().height;
appcan.frame.open("content", "detail_content.html", 0, titHeight);
window.onorientationchange = window.onresize = function() {
appcan.frame.resize("content", 0, titHeight);
}
var se = localStorage.getItem("id");
console.log(se);
var h1 = document.getElementById("h1");
h1.innerHTML=se;
});
appcan.button(".nav-btn", "btn-act", function() {
appcan.window.close(-1);
})
</script>
</html>