MUI 图标筛选切换（父页面传值子页面）

 

1 父页面： index.html

<li class="tab_layout">
     <a href="javascript:;" class="show_type">&nbsp;</a>
</li>

<script>
  var detailPage = null;
    //添加切换样式的点击事件
    mui('.tab_layout').on('tap', 'a', function(e) {
          $(this).toggleClass('show_list');
          var id = this.getAttribute('test');
         //获得列表子页面
         if(!detailPage){
            detailPage = plus.webview.getWebviewById('pullrefresh_sub.html');
         }
         //触发子页面页面的newsId事件
         mui.fire(detailPage,'newsId',{
             id:id
         });
         //打开子页面          

        });
</script>
 

子页面： pullrefresh_sub.html

<div class="searchListBox">
          <!--数据列表-->
          <ul class="mui-table-view mui-table-view-chevron">

               <li>
               <a href="##" class="list_item mui-clearfix">
               <div class="pic_box">
                     <img src="../../images/softlist.jpg" />
                </div>
                <div class="list_word_right">
                      <div class="title_box">欧宝家居现代简约布艺床花纹</div>
                      <div class="comment_box">已售<span style="color: #cb8f36;"> 0</span></div>
                      <div class="price_box">￥16040.00元</div>
                </div>
               </a>
               <span class="bug_car" onclick="addToCart(1254)">
                <i class="icon-shop_cart"></i>
                 </span>
              </li>
         </ul>
 </div>

<script>

window.addEventListener('newsId',function(event){
       $('.searchListBox').toggleClass('openList');
           //通过event.detail可获得传递过来的参数内容
       });

</script>