按钮控制示例

1,

<script>
            appcan.button("#btn1", "ani-act", function() {
                /*添加按钮点击处理代码*/
                alert("黄朝阳666");
                console.log("黄朝阳666 : ");
                alert("黄朝阳888");
            });

            appcan.button("#btn2", "ani-uct", function() {
                var zx = 1001;
                appcan.locStorage.setVal('addGp'+zx, 1);
                appcan.window.open({
                    name : 'hzy',
                    data : 'hzy.html',
                    aniId : 4,
                    animDuration: 1000//动画时间
                })
            });
            
            appcan.button("#btn3", "ani-uct", function() {
                var value = appcan.locStorage.getVal('addGp1001');
                
                var nullTest = appcan.locStorage.getVal('hzy');
                if(nullTest == null) {
                   appcan.locStorage.setVal('hzy', 0);
                }
                nullTest = appcan.locStorage.getVal('hzy');
                if(nullTest != null) {
                     if(nullTest == 0) {
                         appcan.window.confirm({
                            title:'自选股提示',
                            content:'确定删除该股票吗?',
                            buttons:['确定','取消'],
                            callback:function(err,data,dataType,optId){
                                 
                                if(err){
                                    //如果出错了
                                    return;
                                }
                                //data为按钮的下标,0为【确定】,1为【取消】
                                if(data==0){
                                    document.getElementById('btn3').style.color = 'black';
                                    appcan.locStorage.setVal('hzy', 1);
                                    document.getElementById('btn3').innerHTML = '添加自选';
                                }
                                //data 按照按钮的索引返回值
                            }
                        });
                                               
                     } 
                     if(nullTest ==1) {
                         appcan.window.confirm({
                            title:'自选股提示',
                            content:'确定添加该股票吗?',
                            buttons:['确定','取消'],
                            callback:function(err,data,dataType,optId){
                              
                                if(err){
                                    //如果出错了
                                    return;
                                }
                                //data 按照按钮的索引返回值
                                if(data == 0) {
                                    document.getElementById('btn3').style.color = 'red';
                                    document.getElementById('btn3').innerHTML = '删除自选';
                                    appcan.locStorage.setVal('hzy', 0);
                                }
                            }
                        });      
                     }
                     
                }                
                
            });
            

        </script>

  2,

完整代码:

<!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">
        <link rel="stylesheet" href="./css/index.css">
    </head>

    <body class="" ontouchstart>
        <div class="bc-bg" tabindex="0" data-control="PAGE" id="Page">
            <div class="uh bc-head  ubb bc-border" data-control="HEADER" id="Header">
                <div class="ub">
                    <div class="nav-btn" id="nav-left">
                        <div class="fa fa-1g ub-img1"></div>
                    </div>
                    <h1 class="ut ub-f1 ulev-3 ut-s tx-c" tabindex="0">AppCan</h1>
                    <div class="nav-btn" id="nav-right">
                        <div class="fa  fa-1g  ub-img1"></div>
                    </div>
                </div>
            </div>
            <div class="" data-control="CONTENT" id="ScrollContent">
                <div class="btn ub ub-ac bc-text-head ub-pc bc-btn uc-a1"  id="btn1" style="margin: 2em;  5em">
                    按钮
                </div>
                <div class="btn ub ub-ac bc-text-head ub-pc bc-btn uc-a1"  id="btn2" style="margin: 2em;  5em">
                    黄朝阳666
                </div>
                <div class="btn ub ub-ac bc-text-head ub-pc bc-btn uc-a1"  id="btn3" style="margin: 2em;  5em;color: black">
                    添加自选
                </div>

            </div>
        </div>
        <script src="js/appcan.js"></script>
        <script src="js/appcan.control.js"></script>
        <script src="js/appcan.scrollbox.js"></script>
        <script src="js/template.import.js"></script>
        <script src="./assets/mvvm/index.js"></script>
        <script src="./js/index.js"></script>
        <script>
            appcan.button("#btn1", "ani-act", function() {
                /*添加按钮点击处理代码*/
                alert("黄朝阳666");
                console.log("黄朝阳666 : ");
                alert("黄朝阳888");
            });

            appcan.button("#btn2", "ani-uct", function() {
                var zx = 1001;
                appcan.locStorage.setVal('addGp'+zx, 1);
                appcan.window.open({
                    name : 'hzy',
                    data : 'hzy.html',
                    aniId : 4,
                    animDuration: 1000//动画时间
                })
            });
            
            appcan.button("#btn3", "ani-uct", function() {
                var value = appcan.locStorage.getVal('addGp1001');
                
                var nullTest = appcan.locStorage.getVal('hzy');
                if(nullTest == null) {
                   appcan.locStorage.setVal('hzy', 0);
                }
                nullTest = appcan.locStorage.getVal('hzy');
                if(nullTest != null) {
                     if(nullTest == 0) {
                         appcan.window.confirm({
                            title:'自选股提示',
                            content:'确定删除该股票吗?',
                            buttons:['确定','取消'],
                            callback:function(err,data,dataType,optId){
                                 
                                if(err){
                                    //如果出错了
                                    return;
                                }
                                //data为按钮的下标,0为【确定】,1为【取消】
                                if(data==0){
                                    document.getElementById('btn3').style.color = 'black';
                                    appcan.locStorage.setVal('hzy', 1);
                                    document.getElementById('btn3').innerHTML = '添加自选';
                                }
                                //data 按照按钮的索引返回值
                            }
                        });
                                               
                     } 
                     if(nullTest ==1) {
                         appcan.window.confirm({
                            title:'自选股提示',
                            content:'确定添加该股票吗?',
                            buttons:['确定','取消'],
                            callback:function(err,data,dataType,optId){
                              
                                if(err){
                                    //如果出错了
                                    return;
                                }
                                //data 按照按钮的索引返回值
                                if(data == 0) {
                                    document.getElementById('btn3').style.color = 'red';
                                    document.getElementById('btn3').innerHTML = '删除自选';
                                    appcan.locStorage.setVal('hzy', 0);
                                }
                            }
                        });      
                     }
                     
                }                
                
            });
            

        </script>
    </body>

</html>

  3,

原文地址:https://www.cnblogs.com/yang101/p/11606794.html