点击后左侧转圈、文字变「提交中」，禁用再次点击
← 返回 按钮 类特效列表上方为纯 CSS 实时演示，直接将鼠标移上去 / 点击感受效果
.fx .lbtn{position:relative;display:block;width:200px;margin:50px auto;padding:14px 0;border:none;border-radius:10px;background:#4a9eff;color:#fff;font-size:16px;cursor:pointer}
.fx .lbtn::before{content:"";position:absolute;left:20px;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;animation:kfx-spin 1s linear infinite;opacity:0}
.fx .lbtn.busy{pointer-events:none;opacity:.8}
.fx .lbtn.busy::before{opacity:1}
@keyframes kfx-spin{to{transform:rotate(360deg)}}<div class="fx">
<button class="lbtn" onclick="this.classList.add('busy');this.textContent='提交中…';setTimeout(()=>{this.classList.remove('busy');this.textContent='点我提交'},2000)">点我提交</button>
</div>