Kody
Kody
  • 发布:2015-06-11 21:44
  • 更新:2015-06-12 11:23
  • 阅读:4048

如何代码触发a标签的href?

分类:MUI

如题

2015-06-11 21:44 负责人:无 分享
已邀请:
DCloud_UNI_FXY

DCloud_UNI_FXY

mui(document.body).on('tap','a',function(){  
document.location.href = href;  
});
  • Kody (作者)

    直接导致slider重新加载,而且空白一片了,我是想在外部menu触发mui-control-item,来切换不同的mui-slider-item,有没有方法解决?

    2015-06-11 23:20

  • DCloud_UNI_FXY

    回复 Kody:贴完整代码

    2015-06-11 23:25

  • Kody (作者)

    请看下面代码,主要是想实现topPopover里面选择分类后,定位slider具体分类页面,

    2015-06-12 11:26

  • DCloud_UNI_FXY

    监听topPopover的a的tap事件,然后调用mui('#slider').slider().gotoItem(index);

    2015-06-12 15:12

Kody

Kody (作者)

Html

<style>  
            .mui-control-content, .mui-slider-group {  
                background-color: white;  
                min-height: 400px;  
            }  
            .mui-control-content .mui-loading {  
                margin-top: 50px;  
            }  
            #topPopover {  
                position: fixed;  
                top: 16px;  
                right: 6px;  
            }  
            #topPopover .mui-popover-arrow {  
                left: auto;  
                right: 6px;  
            }  
            .mui-popover {  
                height: 350px;  
                width: 150px;  
            }  
        </style>  
        <header class="mui-bar mui-bar-nav">  
            <a class="nnj-icon-back mui-action-back mui-pull-left"></a>  
            <a id="menu" href="#topPopover" class="mui-action-menu mui-icon mui-icon-bars mui-pull-right"></a>  
            <h1 class="mui-title nnj-title"><strong>音乐盒</strong></h1>  
        </header>  
        <div class="mui-content">  
            <div id="slider" class="mui-slider">  
                <div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">  
                    <a id="prev-cate" class="mui-control-item mui-pull-left" style="width:40px"><div style="display:inline-block; color: #FFFFFF; width: 40px; height: 30px; "><</div></a>  
                    <a id="a-cate-title" href="#" class="mui-control-item"><div id="cate-title" class="mui-title" style="width: auto;margin: 0 0; right: 40px; left: 40px;"></div></a>  
                    <a id="next-cate" class="mui-control-item mui-pull-right" style="width:40px"><div style="display:inline-block;color: #FFFFFF; width: 40px; height: 30px; ">></div></a>  
                    <div id="topPopover" class="mui-popover">  
            <div class="mui-scroll-wrapper">  
                <div class="mui-scroll">  
                    <ul id="menuPopover" class="mui-table-view">  

                    </ul>  
                </div>  
            </div>  

        </div>  
                </div>  
                <div class="mui-slider-group">  
                </div>  
            </div>  
            <div class="player">  
                <div class="music-box-title"></div>  
                <a class="music-box-next" id="play-next"></a>  
                <a class="music-box-play" id="play-pause"></a>  
                <a class="music-box-prev" id="play-prev"></a>  
            </div>  
        </div>  

        <div id="myAudio">  
            <audio id="audio">  
            </audio>  
        </div>  
<script src="../js/mui.min.js"></script>  
        <script>  
            var cateList = new Array();  
            var currentCate, currentCollect, collectObject;  
            var playerTitle = document.getElementsByClassName("music-box-title")[0];  
            var play = document.getElementById("play-pause");  
            var cateTitle = document.getElementById("cate-title");  
            var prevCate = document.getElementById("prev-cate");  
            var nextCate = document.getElementById("next-cate");  
            var aTitle = document.getElementById("a-cate-title");  
            var currentSlideNumber = 0;  
            (function($) {  
                $.init();  
                //成功响应的回调函数  
                var successForCate = function(response) {  
                    if (response.ret_code == "0") {  
                        var cate = '';  
                        var content = '';  
                        var menu = '';  
                        mui.each(response.result_list, function(i, c) {  
                            //cate += '<a class="mui-control-item" href="#item' + c.type_code + '">' + c.type_name + '</a>';  

                            cateList[i] = c;  
                            if (i == 0) {  
                                prevCate.href = "#item"+ c.type_code;  
                                content += '<div id="item' + c.type_code + '" class="mui-slider-item mui-control-content mui-active"><div id="scroll' + c.type_code + '" class="mui-scroll-wrapper"><div class="mui-scroll"><div class="mui-loading"><div class="mui-spinner"></div></div></div></div></div>';  
                            } else {  
                                if(i == 1) nextCate.href = "#item"+ c.type_code;  
                                content += '<div id="item' + c.type_code + '" class="mui-slider-item mui-control-content"><div id="scroll' + c.type_code + '" class="mui-scroll-wrapper"><div class="mui-scroll"><div class="mui-loading"><div class="mui-spinner"></div></div></div></div></div>';  
                            }  

                            menu += '<li class="mui-table-view-cell"><a href="#" id="#item'+c.type_code+'">'+c.type_name+'</a></li>';  

                        });  
                        document.getElementById("menuPopover").innerHTML = menu;  
                        mui("#menuPopover").on("tap", "li", function(e){  
                            var item = this.firstChild.getAttribute("id");  
                            aTitle.href = item;  
                            mui.trigger(aTitle,'tap',e);  
                            mui('.mui-popover').popover('toggle');  
                        });  
                        //document.getElementById("sliderSegmentedControl").innerHTML = cate;  
                        document.getElementsByClassName("mui-slider-group")[0].innerHTML = content;  
                        currentCate = cateList[0];  
                        cateTitle.innerHTML = cateList[0].type_name;  
                        getMusicList(plus.device.uuid, currentCate.type_code);  
                        mui('#slider').slider();  
                    }  
                };  
                aTitle.addEventListener("tap", function(e){  
                    document.location.href = this.href;  
                });  
                //              //成功响应的回调函数  
                var successForMusic = function(response) {  
                    if (response.ret_code == "0") {  
                        var item = document.getElementById("item" + currentCate.type_code);  
                        var music = '<ul id="musicList" class="mui-table-view">';  
                        var source = '';  
                        mui.each(response.result_list, function(i, c) {  
                            //if(c.collect_flag) var claName = 'music-box-favorites-on';  
                            //else claName = 'music-box-favorites';  
                            // 歌曲列表  
                            //music += '<li class="mui-table-view-cell" id="' + i + '" songId="'+c.id+'">' + c.song_name + '<a class="'+claName+'"></a></li>';  
                            music += '<li class="mui-table-view-cell" id="' + i + '" songId="'+c.id+'">' + c.song_name + '</li>';  
                            // 歌曲播放源  
                            source += '<source title="' + c.song_name + '" src="' + c.song_url + '"></source>';  
                        });  
                        music += '</ul>';  
                        // 显示数据  
                        item.querySelector('.mui-scroll').innerHTML = music;  
                        audio.innerHTML = source;  
                        sourceList = mui("#myAudio source");  
                        // 设置收藏事件  
//                      mui('.mui-table-view-cell').on('tap', 'a', function(e) {  
//                          var id = this.parentNode.getAttribute("songId");  
//                          if(this.className == "music-box-favorites mui-active") currentCollect = 1;  
//                          else currentCollect = 0;  
//                          collectObject = this;  
//                          updateCollect(plus.device.uuid, id, currentCollect);  
//                      });  
                        // 设置点击播放歌曲事件  
                        mui('#musicList').on('tap', 'li', function(e) {  
                            var index = this.getAttribute("id");  
                            currentSrcIndex = index;  
                            audio.PrevNext();  
                            play.className = "music-box-pause";  
                        });  
                        mui('.mui-scroll-wrapper').scroll();  
                    }  
                };  
                var successForCollect = function(response){  
                    if (response.ret_code == "0") {  
                        console.log(currentCollect);  
                        if(currentCollect == 1)  
                            collectObject.className = "music-box-favorites-on";  
                        else  
                            collectObject.className = "music-box-favorites";  
                    }  
                };  

                // 获取分类数据  
                var getMusicCate = function() {  
                    var url = 'http://120.24.166.135:8080/nnj-openapi-server/rest/music/list_music_type';  
                    $.getJSON(url, null, successForCate);  
                };  
                // 获取音乐数据  
                var getMusicList = function(uuid, cate_code) {  
                    //发送数据  
                    var data = {  
                        client_id: uuid,  
                        type_code: cate_code  
                    };  
                    var url = 'http://120.24.166.135:8080/nnj-openapi-server/rest/music/list_misic';  
                    $.getJSON(url, data, successForMusic);  
                };  
                // 分类翻页事件  
                document.getElementById('slider').addEventListener('slide', function(e) {  
                    currentSlideNumber = e.detail.slideNumber;  
                    currentCate = cateList[e.detail.slideNumber];  
                    cateTitle.innerHTML = cateList[e.detail.slideNumber].type_name;  
                    getMusicList(plus.device.uuid, currentCate.type_code);  
                    nextCate.href = "#item"+cateList[currentSlideNumber + 1 > cateList.length - 1 ? cateList.length -1 : currentSlideNumber + 1 ].type_code;  
                    prevCate.href = "#item"+cateList[(currentSlideNumber - 1) < 0 ? 0 : currentSlideNumber - 1].type_code;  
                    console.log("#item"+cateList[currentSlideNumber + 1 > cateList.length - 1 ? cateList.length -1 : currentSlideNumber + 1].type_code);  
                    console.log("#item"+cateList[(currentSlideNumber - 1) < 0 ? 0 : currentSlideNumber - 1].type_code);  
                });  
                // 播放按钮事件  
                play.addEventListener("tap", function(e) {  
                    if (audio.paused || audio.ended) {  
                        this.className = "music-box-pause";  
                        audio.play();  
                    } else {  
                        this.className = "music-box-play";  
                        audio.pause();  
                    }  
                });  
                // 下一首  
                document.getElementById("play-next").addEventListener("tap", function(){  
                    ++currentSrcIndex > sourceList.length - 1 && (currentSrcIndex = 0);  
                    audio.PrevNext();  
                });  
                // 上一首  
                document.getElementById("play-prev").addEventListener("tap", function(){  
                    --currentSrcIndex < 0 && (currentSrcIndex = 0);  
                    audio.PrevNext();  
                });  

                prevCate.addEventListener("tap",function(){  
//                  var nextSlideNumber = currentSlideNumber;  
                    currentSlideNumber--;  
                    if(currentSlideNumber < 0){  
                        mui.toast("已经是第一页啦!");  
                    }  
//                  nextCate.href = "#item"+cateList[nextSlideNumber].type_code;  
//                  prevCate.href = "#item"+cateList[currentSlideNumber].type_code;  
//                  console.log("prevCate.href"+"#item"+cateList[currentSlideNumber].type_code);  
//                  console.log("nextCate.href"+"#item"+cateList[nextSlideNumber].type_code);  
                });  

                nextCate.addEventListener("tap",function(){  
//                  var prevSlideNumber = currentSlideNumber - 1;  
//                  if(prevSlideNumber < 0) prevSlideNumber = 0;  
                    currentSlideNumber++;  
                    if(currentSlideNumber > cateList.length - 1){  
                        mui.toast("没有啦!亲。");  
                    }  
//                  prevCate.href = "#item"+cateList[prevSlideNumber].type_code;  
//                  nextCate.href = "#item" + cateList[currentSlideNumber+1].type_code;  
//                  console.log("prevCate.href"+"#item"+cateList[prevSlideNumber].type_code);  
//                  console.log("nextCate.href"+"#item" + cateList[currentSlideNumber+1].type_code);  
                });  
                mui('.mui-scroll-wrapper').scroll();  

                $.plusReady(function() {  
                    if ($.os.android) {  
                        plus.screen.lockOrientation("portrait-primary");  
                    }  
                    getMusicCate();  
                });  
            })(mui);  
        </script>  
        <script src="../js/common.js"></script>

该问题目前已经被锁定, 无法添加新回复