详细信息
另一个 jQuery 插件，用于在动作按钮内创建自定义加载微调器，指示调用动作的当前状态。也称为拉达按钮。
根据 GNU 通用公共许可证 v3.0 获得许可。
如何使用它：
1. 为动画加载微调器添加最新的 Font Awesome。
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">2. 在网页上创建一个动作按钮。
<button id="example">
Submit
</button>3.jquery.loadButton.js在 jQuery 之后包含 JavaScript 文件。
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT"
crossorigin="anonymous">
</script>
<script src="jquery.loadButton.js"></script>4. 在点击提交按钮内显示加载微调器。
$("#example").on('click', function(){
$(this).loadButton('on');
});5. 隐藏加载微调器。
$("#example").loadButton('off');6. 自定义加载微调器。
$("#example").on('click', function(){
$(this).loadButton('on',{
faClass: 'fas',
faIcon: 'fa-cog',
doSpin: true
});
});7.自定义加载文本。
$("#example").on('click', function(){
$(this).loadButton('on',{
loadingText: 'Loading...',
});
});8. 自定义加载处理时动作按钮的背景/前景色。
$("#example").on('click', function(){
$(this).loadButton('on',{
loadingBackground: 'darkred',
loadingForeground: 'white'
});
});
发表评论
◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。