jQuery 步骤操作代码示例 - 创建简单步骤切换

.steps {
  display: flex;
}

.step {
  padding: 10px;
  background-color: #eee;
  border: 1px solid #ccc;
  margin-right: 10px;
  cursor: pointer;
}

.step.active {
  background-color: #007bff;
  color: #fff;
}

$(document).ready(function() {
  // 默认第一步为 active
  $('.step:first-child').addClass('active');
  
  // 点击步骤进行切换
  $('.step').click(function() {
    $('.step').removeClass('active');
    $(this).addClass('active');
  });
});

解释:

1. 在文档加载完成后，使用 jQuery 选择器选中第一个步骤，并添加 'active' 类，以使其呈现为活动状态。

2. 使用 jQuery 的 'click' 事件监听器，当步骤被点击时，将所有步骤的 'active' 类移除，并将被点击的步骤添加 'active' 类，以使其呈现为活动状态。

此代码将创建一个简单的步骤操作，用户可以单击每个步骤来切换到该步骤。