javascript - 如何在 Javascript 中调用 @using (Html.BeginForm())

Question

<--这是我想要的计时器-->已更新
尝试让计时器自动点击提交按钮并转到下一页。有一个 Controller 可以对测验进行评分，因此我需要使用下面使用的@using htmlBeginForm。定时器

<div class="row">
<div class="col-md-offset-1">
    <section id="questionForm">
        <h2>Questions</h2>

        <form name="counter">
            <input type="text" size="8"
                   name="d2">
        </form>


        <script type="text/javascript">
            var minutes = 1
            var seconds = 00

            document.counter.d2.value = '30:00'

            function display()
            {
                if (seconds <= 0)
                {
                    minutes -= 1
                    seconds += 59
                }
                if (minutes <= -1)
                {

                    function nextQuestion() {
                        $("#questionform").trigger("submit");
                    }

                    $(document).ready(function () {
                        setTimeout(function () { nextQuestion() }, 5000);
                    });

                }
                else
                    seconds -= 1
                document.counter.d2.value = minutes + ":" + seconds
                setTimeout("display()", 1000)
            }
            display()
        </script>





        @using (Html.BeginForm("Index", "Questions", FormMethod.Post, new { @id = "questionform" }))
        {
            @Html.EditorFor(x => x.Questions)

            <input type="submit" id="submit" class="btn btn-default" value="Submit" />
        }
    </section>
</div>

Answer 1

您似乎正在尝试在给定时间后提交表单。为此，您可以仅使用 setTimeout 函数。

@using htmlBeginForm 是用于创建 form 标记的 Razor 语法，最后您将在渲染中拥有相同的旧 form 标记查看。您可以使用下面的代码来提供您自己的 ID。

@using (Html.BeginForm("actionName", "controllerName", FormMethod.Post, new { @id = "questionform" }))

由于您添加了 jQuery 标签，我假设您可以使用 jQuery 并尝试以下 JavaScript 代码。

我假设您的布局页面有 jQuery 和 script 部分，如下所示。

        @Scripts.Render("~/bundles/jquery")
        @RenderSection("scripts", required: false)
    </body>
</html>

那么你的 View 应该如下所示。

<div class="col-md-offset-1">
    <section id="questionForm">
        <h2>Questions</h2>

        <div id='countdown'></div>

        @using (Html.BeginForm("Index", "Questions", FormMethod.Post, new { @id = "questionform" }))
        {
            @Html.EditorFor(x => x.Questions)
            <input type="submit" id="submit" class="btn btn-default" value="Submit" />
        }
    </section>
</div>

@section Scripts {
    <script type="text/javascript">
        $(document).ready(function() {
            countdown('countdown');
        });

        function countdown(element) {
            var interval;
            var minutes = 1;
            var seconds = 30;

            interval = setInterval(function() {
                var el = document.getElementById(element);
                if(seconds == 0) {
                    if(minutes == 0) {
                        el.innerHTML = "Time's Up!";                    
                        clearInterval(interval);
                        $("#questionform").trigger("submit");
                        return;
                    } else {
                        minutes--;
                        seconds = 60;
                    }
                }
                el.innerHTML = minutes + ' : ' + seconds;
                seconds--;
            }, 1000);
        }
    </script>
}

JSFiddle Example