                        課程
                    
                        /前端開發
                        
                            /Bootstrap
                        
                        /玩轉Bootstrap（基礎）

狀態樣式設置有點不太明白

如果在li標簽上添加了disabled類名的時候，分頁按鈕處于禁用狀態，但同樣不能禁止其點擊功能。你可以通過js來處理，或將a標簽換成span標簽。這句話是什么意思呢？有點看不懂

好久不見4014797

2016-11-16

源自：玩轉Bootstrap（基礎） 6-10

關注問題我要回答

718

操作

收起

2 回答

JS嘛霸哥
2017-02-22

嗯，我默認你已經知道了jquery的基本用法，咱們來實現一下點擊disable類下的<a>標簽不跳轉href中鏈接的例子

首先，準備一個網頁

??<!DOCTYPE?HTML>
<html>
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8">
<title>基本導航條</title>
<link?rel="stylesheet"?>
</head>
<style>
.navbar-fixed-top?~?.content{
??padding-top:?70px;
}
</style>
<body>
??<ul?class="pager">
????<li><a?href="http://www.xianlaiwan.cn">&laquo;上一頁</a></li>
????<li?class="disabled"><a?>下一頁&raquo;</a></li>
??</ul>
?</body>
<script?src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script?src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>?
<script?type="text/javascript">
//?TODO:?禁止disable類下的href鏈接的作用
</script>
</body>
</html>

好了，看一下，點上一頁去慕課網，下一頁是搜狐視頻

但是，下一頁應該是禁用狀態，所以我們在//TODO的位置添加代碼

??//?頁面dom加完成時執行
??$(document).ready(function()?{
????//?jquery選擇器?disbale類下的a標簽注冊一個點擊事件
????$(".disabled?>?a").click(function()?{
??????//通過return?false可以禁止觸發href中的事件
??????return?false;
????})
??});

這樣之后刷新網頁，確保清除緩存之后再點擊下一頁，神馬都不會發生啦~

祝你學習愉快