Java 使用jquery每3秒显示一次时间无法正常工作_Java_Jquery_Jsp

Java 使用jquery每3秒显示一次时间无法正常工作

java jquery jsp

Java 使用jquery每3秒显示一次时间无法正常工作,java,jquery,jsp,Java,Jquery,Jsp,我对“jsp”和“jquery”非常陌生，我认为下面的代码应该在屏幕上显示一个数字，并且每3秒增加一个，但是在重复2到3次之后，它就会中断并开始显示错误的数字 <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <script type="text/javascript" src="js/jquery-1.11.2.js"></

我对“jsp”和“jquery”非常陌生，我认为下面的代码应该在屏幕上显示一个数字，并且每3秒增加一个，但是在重复2到3次之后，它就会中断并开始显示错误的数字

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <script type="text/javascript" src="js/jquery-1.11.2.js"></script>
    <script type="text/javascript">
        var auto_refresh = setInterval(
                function () {
                    $('#load_me').load('index.jsp').fadeIn("fast");
                }, 3000); // autorefresh the content of the div after
        //every 3000 milliseconds(3sec)
    </script>
</head>
<body>
<%! int i = 0;%>
<div id="load_me">
    <%out.print(++i);%>
</div>
</body>
</html>


var auto_refresh=setInterval(
函数（）{
$（'load_me'）.load（'index.jsp'）.fadeIn（“fast”）；
}, 3000); // 之后自动刷新div的内容
//每3000毫秒（3秒）

我甚至试图显示时间而不是打印数字，但同样的问题也出现了：

<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.util.Date" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <script type="text/javascript" src="js/jquery-1.11.2.js"></script>
    <script type="text/javascript">
        var auto_refresh = setInterval(
                function () {
                    $('#load_me').load('index.jsp').fadeIn("fast");
                }, 3000); // autorefresh the content of the div after
        //every 3000 milliseconds(3sec)
    </script>
</head>
<body>
<div id="load_me">
    <%
        Date d = new Date();
        SimpleDateFormat sp = new SimpleDateFormat("hh:mm:ss");
        String t= sp.format(d);
        out.print(t);
    %>
</div>
</body>
</html>


var auto_refresh=setInterval(
函数（）{
$（'load_me'）.load（'index.jsp'）.fadeIn（“fast”）；
}, 3000); // 之后自动刷新div的内容
//每3000毫秒（3秒）

似乎您希望“div#load(加载)me”每3秒显示一个递增1的数字。。针对相同的问题，请尝试以下纯javaScript：

setInterval((function() {
var currNumber = 0;
return function() {
document.getElementById('load_me').innerHTML = ++currNumber;
}
})(), 3000);

编辑（演示完整代码）：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <!-- we do not need jquery any more :-) -->
</head>
<body>
<div id="load_me">

</div>
<script>
setInterval((function() {
    var currNumber = 0;
    return function() {
    document.getElementById('load_me').innerHTML = ++currNumber;
    }
    })(), 3000);
</script>
</body>
</html>


setInterval（（函数（）{
var currNumber=0；
返回函数（）{
document.getElementById（'load_me'）。innerHTML=++currNumber；
}
})(), 3000);

这样，您也可以避免不必要的服务器调用。

下面的代码用于显示时间，但您必须创建date.jsp页面

<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.util.Date" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <script type="text/javascript" src="js/jquery-1.11.2.js"></script>
    <script type="text/javascript">
        var auto_refresh = setInterval(
                function () {
                    $('#load_me').load('date.jsp').fadeIn("slow");
                }, 3000); 
    </script>
</head>
<body>
<div id="load_me">
<%@ include file="date.jsp"%>
</div>
</body>
</html>


var auto_refresh=setInterval(
函数（）{
$（'#load_me'）.load（'date.jsp'）.fadeIn（“slow”）；
}, 3000);

date.jsp：

<%@ page import="java.util.Date" %>
<%@ page import="java.text.SimpleDateFormat" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
</head>
<body>
<%
    Date d = new Date();
    SimpleDateFormat sp = new SimpleDateFormat("hh:mm:ss");
    String t= sp.format(d);
    out.print(t);
%>
</body>
</html>

非常好，谢谢，但是你能告诉我我的代码有什么问题吗，因为我正在尝试学习jquery。你发布的代码样本都试图获取一些index.jsp来绘制“div#load(u me)”。这还涉及到网络往返，这可能会导致输出不一致。我如何用同样的方法刷新整个页面？