APIClout 廣播

frame1 裏打開frame2 ,frame2點擊廣播事件 ,frame1監聽

<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>title</title>
      <link rel="stylesheet" type="text/css" href="../css/api.css"/>
      <style>
          body{
          }
          #frm1{
            line-height: 200px;
            width: 100%;
            text-align: center;
          }
      </style>
  </head>
  <body>
<div id="frm1">

</div>
  </body>
  <script type="text/javascript" src="../script/api.js"></script>
  <script type="text/javascript">
      apiready = function(){
        listen();
        api.openFrame({
            name: 'frame2',
            url: 'frame2.html',
            rect: {
                x: 0,
                y: 500,
                w: 'auto',
                h: 'auto'
            },
            pageParam: {
                name: 'test'
            },
            bounces: true,
            bgColor: 'rgba(0,0,0,0)',
            vScrollBarEnabled: true,
            hScrollBarEnabled: true
        });

      };
      function listen() {
        api.addEventListener({
            name: 'myEvent'
        }, function(ret, err) {
            alert(JSON.stringify(ret.value));
            var frm = $api.byId('frm1');
            $api.html(frm, '<h1>'+ ret.value.key1 +'</h1>');

        });
      }
  </script>
  </html>
<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>title</title>
      <link rel="stylesheet" type="text/css" href="../css/api.css"/>
      <style>
          body{
            background-color: #333;
          }
          button{
            width: 100%;
            height: 80px;
            line-height: 80px;
            text-align: center;
            background-color: green;
            color: #fff;
          }
      </style>
  </head>
  <body>
    <button type="button" name="button" onclick="submit()">確定</button>

  </body>
  <script type="text/javascript" src="../script/api.js"></script>
  <script type="text/javascript">
      apiready = function(){

      };
      function submit(){
        api.sendEvent({
            name: 'myEvent',
            extra: {
                key1: '成功了',
                key2: 'ok了'
            }
        });
      }
  </script>
  </html>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章