javascript 步进条件在 asp.net c# 中不起作用

Question

我在 asp.net 中使用 HTML 标记用于多步进度条目的。 但是脚本在我的应用程序中不起作用，请为此提供解决方案

我的 Asp.net 代码是-

    <div class="progress" runat="server">

        <div class="progress-track" runat="server" ></div>
        <div id="step1" class="progress-step" runat="server"   >
           Step1
        </div>
    .
    .
    .
    .
    </div>
     

<asp:Button ID="Button1" runat="server" Text="Next" type="button" OnClientClick="return next();" onClick="NextStep" />

 

和 javascript 是-

<script type="text/javascript">

    let step = 'step1';
    const step1 = document.getElementById('ctl00_ContentPlaceHolder1_step1');
    const step2 = document.getElementById('ctl00_ContentPlaceHolder1_step2');
    const step3 = document.getElementById('ctl00_ContentPlaceHolder1_step3');

    function next(step) {
        if (step === 'step1') {
            step = 'step2';
            step1.classList.remove("is-active");
            step1.classList.add("is-complete");
            step2.classList.add("is-active");

        .
        .
        .
        } else if (step === 'complete') {
            step = 'step1';
            step3.classList.remove("is-complete");
            step2.classList.remove("is-complete");
            step1.classList.remove("is-complete");
            step1.classList.add("is-active");
        }
    }
</script>

步骤过程不起作用

Answer 1

这是因为您创建了对服务器的回发，而服务器不关心客户端更改并再次呈现旧的 state。

最简单的解决方案是将您的 javascript 转换为 c# 代码，并按照我的假设在代码后面执行此操作，您也在按钮处理程序中执行其他服务器端操作。