javascript - 網易云音樂是如何實現a標簽href有值不跳轉的？

問題描述

比如這個頁面http://music.163.com/#/song?i...點擊下面的歌名，頁面沒有刷新也沒跳轉，是如何實現的。

問題解答

http://music.163.com/#/song?i...#號后面的東西叫片段，也可以叫錨點。 這東西不會刷新瀏覽器，也不會提交一個請求給服務器，但是可以生成一條瀏覽器記錄。獲取#號后面的值是window.location.hash所以只需要監控這個hash值的變化就可以了onhashchange

window.location.hash

iframe

估計你是新手吧... 多看源代碼吖

_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(樓上說的),還有路由