【APPCAN】的页面传值

最新推荐文章于 2021-08-06 12:37:31 发布

不善言辞-不行于色

最新推荐文章于 2021-08-06 12:37:31 发布

阅读量4.5k

点赞数 1

分类专栏： js appcan

本文链接：https://blog.csdn.net/u010918847/article/details/49179945

版权

js 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

appcan

2 篇文章 0 订阅

订阅专栏

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>