将表单提交到 Servlet 后如何调用 javascript 函数？答案

【问题标题】：How to call a javascript function after submit Form to Servlet?将表单提交到 Servlet 后如何调用 javascript 函数？
【发布时间】：2021-05-13 22:50:54
【问题描述】：

我尝试制作倒计时时钟，但我无法通过<script type="text/javascript">...</script> 在<c:if>...</c:if> 中调用javascript 函数。你能帮我解决这个问题或给出一些解决方案在jsp文件中倒计时吗？

demo.jsp：countdonw() 函数未调用

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Demo Page</title>
    </head>
    <body>
        <form action="demo" method="POST">
            Time: <input type="text" id="input-time" name="inputTime">
            <input type="submit" value="Start">
        </form>

        <c:if test="${timeRemain!= null}">
                <input type="hidden" id="time-remain" value="${timeRemain}">
                <p>Time Remaining:  <span id="display-time"></span></p> //this line work
                <script  type="text/javascript">
                    countDown();  //not call this function
                </script>
        </c:if>

    </body>
    <script type="text/javascript">
        async function countDown() {
            var timeRemain = document.getElementById("time-remain").value;
            alert(timeRemain);
        }
       
    </script>
</html>

demo.java servlet 只是将timeRemain 发送到 jsp 文件。

protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
//        processRequest(request, response);
        String inputTime = request.getParameter("inputTime");
        request.setAttribute("timeRemain", Integer.parseInt(inputTime));
        request.getRequestDispatcher("demo.jsp").forward(request, response);
    }

【问题讨论】：

你想达到什么目的？提交后调用 JavaScript 函数没有意义，因为提交后当前页面将被提交响应替换。似乎您混合和匹配不同的执行上下文。 c:if 在渲染 HTML 页面时在服务器端执行。 JavaScript 函数在收到响应后在客户端执行。
@vanje 我希望在提交到 servlet 后时钟会倒计时。你能给我关于的其他想法吗？
问题不在于 c:if。您应该首先了解有关不同 Web 技术的更多信息。例如。实现没有任何 JavaScript 的第一个版本。只有 JSP 和 Servlet。您可以将计数器值保存在会话变量中。然后第二个版本作为静态 HTML 仅使用 JavaScript。第三个版本将客户端和服务器端与 AJAX 相结合。

标签： java jsp servlets

【解决方案1】：

试试这个：

         <script  type="text/javascript">   //oustide  <c:if> tag

          var timeRemain = document.getElementById("time-remain").value;
          if(timeRemain.length>0 && timeRemain !== "undefined")
          {
           countDown();
           }
         </script>

注意：更好的选择是 AJAX 在这里

参考：https://www.javatpoint.com/ajax-tutorial

【讨论】：