设置一个文本框和一个“发送验证码”按钮，在单击“发送验证码”按钮后，该按钮中的文字会变为“60秒后重新发送”，并且“60”会每秒减1。在60秒后，才能再次单击“发送验证码”按钮，并且按钮恢复为初始状态

这种功能通常在前端Web开发中使用JavaScript来实现，特别是配合HTML和CSS。首先，你需要创建一个HTML结构，包含一个输入框和一个按钮：

<input type="text" id="verifyCodeInput" placeholder="请输入验证码">
<button id="sendBtn">发送验证码</button>

然后在JavaScript中编写逻辑，监听`click`事件并处理计时器：

let countdown = 60;
let sendBtn = document.getElementById('sendBtn');
let countdownText = '60秒后重新发送';

// 重置按钮文本和禁用点击
function resetButton() {
  sendBtn.textContent = '发送验证码';
  sendBtn.disabled = false;
}

// 发送验证码的点击事件处理器
sendBtn.addEventListener('click', function () {
  // 检查验证码是否输入，若已输入则先清除
  if (document.getElementById('verifyCodeInput').value) {
    document.getElementById('verifyCodeInput').value = '';
  }
  
  // 禁用按钮并更新文字
  sendBtn.textContent = countdownText;
  sendBtn.disabled = true;
  
  // 开始倒计时
  countdown--;
  if (countdown > 0) {
    setTimeout(() => {
      updateCountdownText(countdown);
    }, 1000); // 每隔1秒递减
  } else {
    resetButton();
  }
});

// 更新倒计时文字函数
function updateCountdownText(secondsRemaining) {
  countdownText = `${secondsRemaining}秒后重新发送`;
  sendBtn.textContent = countdownText;
}

在这个例子中，当用户点击“发送验证码”按钮时，计时器开始运行，按钮的文字和交互性会被改变。随着时间流逝，`updateCountdownText`函数会在后台每秒调用一次，更新显示的时间。当倒计时结束时，会通过`resetButton`函数将按钮恢复到原始状态。