Question

我遇到了一个代码，据说只更新那段代码，代码放在div标记内。我需要打印1-1-2013的剩余秒数。但我什么也看不见。放置在div标记内的任何内容都不可见。由于我不在JQuery和Ajax，我无法发现错误。

<body bgcolor="#73AF59">

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js">

    </script>

    <audio  preload="auto" src="tones/Time-In-A-Bottle.mp3" loop autoplay> 

    </audio>

    <%! 
      GregorianCalendar newYear =  new GregorianCalendar(2013, 0, 1);  
      /*
       * 0 : January
       * 1 : 1st January
       * 2013 : year
       */           
    %>


<table width="100%">
<tr> 
  <td width="40%"> </td>
  <td> <img src="images/animations/pyear.gif" /> </td>
</tr>

<tr>
  <td width="40%"> <center> <font face="Chiller" size="+6"> <br /> Countdown </font> </center> </td>
  <td>  <center> <font face="Chiller" size="+6"> <br /> 
      <script type="text/javascript">
        var auto_refresh = setInterval(
        function ()
        {
            $('#load_tweets').load('record_count.php').fadeIn("slow");
        }, 1000); // refresh every 10000 milliseconds
        <div id="load_tweets">

         <%= ( newYear.getTimeInMillis() - new GregorianCalendar().getTimeInMillis() ) / 1000 %>

        </div>
      </script>
      </font> </center>
</td>
</tr>

<tr>
  <td colspan="2" style="height:400px"  valign="bottom"> <img src="images/animations/3D_balloons.gif" /> 
        <em>This poor design and animations compiled by Suhail Gupta.</em>
            <audio style="visibility: hidden" > </audio>
  </td>
</tr>
<!-- !-->

声明<%= ( newYear.getTimeInMillis() - new GregorianCalendar().getTimeInMillis() ) / 1000 %>，应打印2013年到来的秒数。

Answer 1

有几点需要考虑：

您缺少jQuery的doc ready处理程序
您已将div放在<script/>标记
尝试删除fadeIn

所以你的代码必须是这样的：

<body bgcolor="#73AF59">

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>

    <audio  preload="auto" src="tones/Time-In-A-Bottle.mp3" loop autoplay></audio>

    <%! 
      GregorianCalendar newYear =  new GregorianCalendar(2013, 0, 1);  
      /*
       * 0 : January
       * 1 : 1st January
       * 2013 : year
       */           
    %>


<table width="100%">
<tr> 
  <td width="40%"> </td>
  <td> <img src="images/animations/pyear.gif" /> </td>
</tr>

<tr>
  <td width="40%"> <center> <font face="Chiller" size="+6"> <br /> Countdown </font> </center> </td>
  <td>   
      <script type="text/javascript">
      $(document).ready(function(){ // try to put in doc ready handler
        var auto_refresh = setInterval(function (){
            $('#load_tweets').load('record_count.php');
        }, 1000); // refresh every 10000 milliseconds
      });
      </script>
      <center> 
      <font face="Chiller" size="+6"> <br />
        <div id="load_tweets">
         <%= ( newYear.getTimeInMillis() - new GregorianCalendar().getTimeInMillis() ) / 1000 %>
        </div> 
         </font> 
      </center>
</td>
</tr>

<tr>
  <td colspan="2" style="height:400px"  valign="bottom"> <img src="images/animations/3D_balloons.gif" /> 
        <em>This poor design and animations compiled by Suhail Gupta.</em>
            <audio style="visibility: hidden" > </audio>
  </td>
</tr>
<!-- !-->

或者你可以在jQuery下面移动它：

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
    <script type="text/javascript">
      $(document).ready(function(){ // try to put in doc ready handler
        var auto_refresh = setInterval(function (){
            $('#load_tweets').load('record_count.php');
        }, 1000); // refresh every 10000 milliseconds
      });
     </script>

试试这个，看看这对你有帮助。

Answer 2

要以给定的时间间隔在网页上打印结果（减去两个日期的工厂），您需要创建一个servlet来生成工厂的减法并在JSP中编写Ajax例程来请求servlet

<强>的Servlet

@WebServlet(name = "TestServlet", urlPatterns = {"/test"})
public class TestServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
       double value=((double)(new GregorianCalendar(2013, 0, 1).getTimeInMillis() - new GregorianCalendar().getTimeInMillis()))/1000;
       PrintWriter pw=response.getWriter();
       response.setContentType("text/plain");
       pw.print(value);
       pw.flush();
    }
}

和使用$.ajax方法请求servlet的页面：

<强>测试page.jsp

 <head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(function(){
            setInterval(function(){  
                $.ajax({
                    url: 'test',
                    type: 'get',
                    dataType: 'text',
                    success: function(data){
                        $("#result").html(data);
                    }
                });
            },1000);
        });
    </script>
</head>
<body>
    <div id="result"></div>
</body>

我放在div标签内的任何东西都不会被打印出来

2 个答案: