a標籤裡面巢狀一個a標籤,點選子連結標籤時,同時觸發了父標籤a
情景還原:
html生成的原始碼:
<a href="main.aspx?type=navTwo&stuNo=19&navName=電子資源" style="font-size: 16px;">電子資源
<b style="background: url(http://localhost:58596/images/LS/right.png);"></b>
<div class="c1-child" style="display: block; left: 124px; color: rgb(0, 0, 0);">
<span onclick="redict('41','電子資源')" style="color: rgb(0, 0, 0); background: rgb(255, 255, 255);">資料庫</span>
<span onclick="redict('40','電子資源')" style="color: rgb(0, 0, 0); background: rgb(255, 255, 255);">試用資料庫</span>
<span onclick="redict('39','電子資源')">自建特色資料庫</span>
</div>
</a>
span點選觸發事件:
function redict(id, name) {
//接下來使用js程式碼進行頁面跳轉
window.location.href = "main.aspx?type=nav&stuNo=" + id + "&navName=" + name;
}
當點選span內的標籤時會觸發a標籤的href 導致跳轉連結不正確
解決辦法:
js新增event.preventDefault();
阻止預設事件.比如當你點選帶有href值的a標籤時,元素響應click事件後,還會發生頁面跳轉.如果加上這個方法(屬性)後,瀏覽器只會響應click事件,不會發生跳轉.
更改js:
function redict(id, name) {
event.preventDefault();
//接下來使用js程式碼進行頁面跳轉
window.location.href = "main.aspx?type=nav&stuNo=" + id + "&navName=" + name;
}
相關文章
- html中p標籤內為何不能巢狀div標籤?HTML巢狀
- 在<a>標籤中直接傳遞引數時,多個<a>標籤在點選時會衝突
- html中在span標籤裡面可以放那些標籤?HTML
- properties標籤和typeAliases標籤
- HTML標籤(基本標籤的使用)HTML
- K8S標籤與標籤選擇器K8S
- VOC標籤轉化為YOLO標籤YOLO
- HTML簡介,結構,標籤以及標籤語義HTML
- C#裡面超連結標籤的使用C#
- HTML常用基礎標籤:圖片與超連結標籤全解!HTML
- HTML <a> 標籤HTML
- html標籤HTML
- Git 標籤Git
- base標籤
- JSTL標籤JS
- 織夢CMS友情連結標籤
- dedecms 模版裡格式化時間標籤
- 去一級標籤
- html標籤整理HTML
- HTML 常用標籤HTML
- HTML <label> 標籤HTML
- HTML <body>標籤HTML
- 標籤記錄
- html基本標籤HTML
- HTML <div>標籤HTML
- html列表標籤HTML
- Git tag 標籤Git
- HTML <meta>標籤HTML
- HTML <iframe>標籤HTML
- HTML <span>標籤HTML
- HTML <head>標籤HTML
- xss常用標籤
- HTML <figcaption> 標籤HTMLGCAPT
- HTML <dialog> 標籤HTML
- HTML <time> 標籤HTML
- HTML <aside> 標籤HTMLIDE
- HTML <article> 標籤HTML
- HTML <section> 標籤HTML
- HTML <main> 標籤HTMLAI