javascript - 網易云音樂是如何實現a標簽href有值不跳轉的?
問題描述
比如這個頁面http://music.163.com/#/song?i...點擊下面的歌名,頁面沒有刷新也沒跳轉,是如何實現的。
問題解答
回答1:http://music.163.com/#/song?i...#號后面的東西叫片段,也可以叫錨點。 這東西不會刷新瀏覽器,也不會提交一個請求給服務器,但是可以生成一條瀏覽器記錄。獲取#號后面的值是window.location.hash所以只需要監控這個hash值的變化就可以了onhashchange
回答2:window.location.hash
回答3:iframe
回答4:估計你是新手吧... 多看源代碼吖
_onAnchorClick = function(_event){//截獲所有<a>標簽的點擊事件,自定義頁面的跳轉 _event = _event||window.event; var _el = _event.target||_event.srcElement, _base = location.protocol+’//’+location.host;while(_el&&_el!=document){// ... }}_addEvent(document,’click’,_onAnchorClick);
其實就是用了 Event.preventDefault
<a >我想跳轉到百度搜索哆啦A夢</a> <script src='https://code.jquery.com/jquery-3.1.0.js'></script> <script>$(’a’).on(’click’, function (event) { event.preventDefault(); }) </script>回答5:
頁面其實就是沒有刷新,你知道'#target',可以將你的頁面跳轉到target的位置,這個其實和這個差不多,進一步你可以了解js的hash(樓上說的),還有路由
相關文章:
1. javascript - 百度echarts series數據更新問題2. MySQL客戶端吃掉了SQL注解?3. python小白的基礎問題 關于while循環的嵌套4. css3 - [CSS] 動畫效果 3D翻轉bug5. javascript - JS設置Video視頻對象的currentTime時出現了問題,IE,Edge,火狐,都可以設置,反而chrom卻...6. java - 我設置了cookie的max age,但是cookie依然在關閉游覽器后消失了7. java固定鍵值轉換,使用枚舉實現字典?8. php自學從哪里開始?9. phpstady在win10上運行10. 求大神幫我看看是哪里寫錯了 感謝細心解答
