2012-12-27 106 views
-2

我碰到一個代碼,據說只更新那段代碼,它放在div標籤內。我需要打印剩下的秒數1-1-2013。但我什麼都看不到。放在div標記內的任何內容都不可見。由於我不在JQueryAjax,我無法發現我的錯誤。我把任何東西放在div標籤中,沒有打印

<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年

+0

我上傳了完整的代碼[HERE](http://suhail3.my3gb.com/nyblast%20%28copy%29.jsp) –

+0

'font'標籤??它們在html5中被棄用。使用CSS – charlietfl

+0

Scriptlet只執行一次,除非你刷新當前頁面,並且'$('#load_tweets')。load('record_count.php')。fadeIn(「slow」);'do ? – adatapost

回答

0

要在給定的時間間隔在網頁上打印結果(減去兩個日期的工廠),您需要創建一個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> 
0

到來秒有幾個事情要考慮:

  1. 你缺少用於jQuery的doc ready處理程序
  2. 您所放置<script/>標籤
  3. 嘗試用去除裏面的DIV的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> 

試試看看這是否對您有所幫助。

+0

不..它沒有更新。我只是試着複製粘貼上面的代碼 –

+0

你在**'record_count.php' **文件中有什麼 – Jai