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. android百度地圖定位問題2. javascript - JS new Date() 保存到 mongodb 中會早8個小時,我們這里是東八區,mongodb 保存的是格林尼治時間3. boot2docker無法啟動4. javascript - 如何判斷不同兩個對象觸發同一事件?5. javascript - 移動端上不能實現拖拽布局嗎?6. java - 判斷數據在數據庫中是否已存在.7. javascript - 關于圣杯布局的一點疑惑8. python - django models 為生成的html元素添加樣式。9. android - 圖片列表分組之后復用問題10. thinkPHP5中獲取數據庫數據后默認選中下拉框的值,傳遞到后臺消失不見。有圖有代碼,希望有人幫忙

網公網安備