JQuery Button Loading插件是一款實用插件，可以在按鈕被點擊的時候顯示一個Loading狀態(tài)，提高用戶體驗。下面是一個使用JQuery Button Loading插件的例子。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JQuery Button Loading Example</title>
<link rel="stylesheet" >
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.loading/1.0.0/jquery.loading.min.js"></script>
</head>
<body>
<div class="container">
<button type="button" class="btn btn-primary btn-lg" id="loading-example-btn">Click me to load</button>
</div>
<script>
$(document).ready(function(){
$("#loading-example-btn").click(function(){
$(this).button('loading');
});
});
</script>
</body>
</html>上面的代碼中，我們先在head中引入了Bootstrap的CSS和JS文件，以及JQuery和JQuery Button Loading插件的JS文件。然后在頁面中放了一個按鈕。在JS代碼中，我們使用了JQuery的ready方法，然后給按鈕的點擊事件綁定了一個函數(shù)。在函數(shù)中，調(diào)用了button方法，將按鈕的狀態(tài)設置為“l(fā)oading”，從而顯示出Loading狀態(tài)。
JQuery Button Loading插件還有許多可選參數(shù)，比如說可以自定義Loading時顯示的圖標、文字等等。使用這個插件可以為你的網(wǎng)站用戶提供更好的交互體驗。
上一篇可口可樂css部門
下一篇mysql三種性能分析