在JavaScript中，可以使用<input>或<textarea>元素的.value property读取该元素的值。要设置元素的文本内容，可以使用.innerText property。
此外，当<form>中有一个<button>元素时，您可能需要确保type属性设置为button（例如：<button>）。<button type="button">...</button>），这是因为默认类型是submit，它将触发表单的提交。（更多信息：https：//developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attributes)
下面的代码包括我上面提到的修复，通过监听输入的change event，这允许同步从输入到<span>元素的值：

const prevBtn = document.querySelectorAll(".prev-btn");
const nextBtn = document.querySelectorAll(".next-btn");
let currentSection = 0;

const firstNameInput = document.getElementById('firstname-input');
const firstNameSpans = Array.from(document.querySelectorAll('.firstname'));
firstNameInput.addEventListener('change', () => {
  firstNameSpans.forEach((firstNameSpan) => { firstNameSpan.innerText = firstNameInput.value; });
});

function showSection(sectionIndex) {
  const sections = document.querySelectorAll(".steps");
  sections[currentSection].classList.remove("active-step");
  sections[sectionIndex].classList.add("active-step");
  currentSection = sectionIndex;
}

function nextSection() {
  if (currentSection < 2) {
    showSection(currentSection + 1);
  }
}

function prevSection() {
  if (currentSection > 0) {
    showSection(currentSection - 1);
  }
}

.steps{
    display: none;
}

.active-step{
    display: block;
}

<form action="">
    <!-- Step1 -->
    <div class="steps active-step" id="step1">
        <div class="step-title">What's your first name?</div>
        <div class="step-content">
            <div class="input-area">
                <input type="text" class="text-input" placeholder="First Name" id="firstname-input">
            </div>
        </div>
        <div class="btn-next-box">
            <button onclick="nextSection()" type="button" class="next-btn" id="step1-next">Next</button>
        </div>
    </div>

    <!-- Step2 -->
    <div class="steps" id="step">
        <button onclick="prevSection()" type="button" class="prev-btn">Prev</button>
        <div class="step-title"><span class="firstname"></span>,which club you're in?</div>
        <div class="step-content">
            <div class="input-area">
                <input type="text" class="text-input" placeholder="your club name" id="club-input">
            </div>
        </div>
        <div class="btn-next-box">
            <button onclick="nextSection()" type="button" class="next-btn" id="step1-next"></button>
        </div>
    </div>
</form>