Question

＆lt; - 这是我想要的计时器 - ＆gt;已更新
试图让计时器自动点击提交按钮并转到下一页。有一个控制器对测验进行评分，所以我需要使用下面使用的@using htmlBeginForm。 TIMER

<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中将使用相同的旧View标记。您可以使用以下代码来提供自己的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>

然后您的观点应如下所示。

<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

如何在Javascript中调用@using（Html.BeginForm（））

1 个答案: