簡體   English   中英

Javascript刷新

[英]Javascript Refresh

有沒有一種方法可以使用下面的代碼代替刷新時間來刷新已經存在的div id?

  <script type="text/javascript">
window.onload = startInterval;
function startInterval()
{
    setInterval("startTime();",1000);
}

function startTime()
{
    document.getElementById('drawaddrow').innerHTML = ????;  
}
</script>

假設我將用我想刷新的.innerHTML = ???之后的ID替換時間ID。

這是我需要每秒刷新的div。

<div id="draw" align="center">
<table>

    <tr><td style="height:20px;"></td></tr>

</table>


        <TABLE style="float:center;border:5px; border-style:outset;border-color:#E80000; width:850px; border-spacing:0; border-collapes:collapse;" table border="1">
            <div id="addrow"><script type="text/javascript">
            Draw ("")
            [Add]</script></div>
        </table>

</div>

[AddItemsHTML]以某種方式從一個軟件中提取數據,告訴您什么是到期,什么不是,但是該腳本並沒有每秒刷新一次瀏覽器的時間,刷新時只是更改了到期狀態列上的時間。

現在,我正在使用它來刷新整個頁面,我只需要刷新drawaddrow div id。

    function refreshPage () {
     var page_y = document.getElementsByTagName("body")[0].scrollTop; 
     window.location.href = window.location.href.split('?')[0] + '?page_y=' + page_y;

}
     window.onload = function () {
         setTimeout(refreshPage, 1000);
            if (window.location.href.indexOf('page_y') != -1 ) {
                var match = window.location.href.split('?')[1].split("&")[0].split("=");
                document.getElementsByTagName("body")[0].scrollTop = match[1];

            }

更新(2013年7月27日@ IST 08:20):

閱讀完您的代碼后,以下是我的最新答案。

  1. 由於以下原因,無法使用( .innerHTML )將值簡單地分配給DIV( divaddrow ):
    (a)DIV在方括號內包含一些代碼(例如[AddItemsHTML] )。 我不確定它使用什么技術。 但是從其預期用途(即用數據填充表)來看,它似乎確實需要與服務器進行通信才能獲取數據。
    (b)DIV還具有<script>標記,該標記帶有對函數的調用(將其稱為cntFn)。 簡單地分配值將不起作用,因為值設置不會再次調用/執行該函數(就像頁面加載時一樣)。
  2. 假設1.a錯誤,處理1.b的正常方法是先使用.innerHTML分配div的靜態內容,然后執行(a)將“ cntFn”所做的任何事情寫入刷新的函數中該頁面(我們稱其為refreshFn)也(或)(b)在“ refreshFn”內稱為“ cntFn”。 后者也會在這里引起問題,因為“ cntFn”具有很多document.write行,它們將重新繪制整個頁面(這意味着該頁面的其他內容在執行刷新時會丟失)。
  3. 通常,使用document.write行是一種不好的做法,因為它們會完全重畫頁面。 您可以在這里找到更多關於此的信息
  4. 我認為最好的替代方法是使用AJAX刷新內容。 divaddrow div的內容將形成AJAX文件的內容,該文件需要每隔'x'秒被調用一次。 小心“ x”秒部分。 不要嘗試每秒刷新一次該部分,因為實際上AJAX請求需要花費一些時間才能到達服務器並獲得響應。 設置刷新間隔,以便在下一個請求到來之前(至少有90%的情況)已經處理了第一個請求。 AJAX調用將要獲取的數據量(行數)也是一個因素。

看看這個...我用Jquery一樣

 $(document).ready(
            function() {
                setInterval(function() {
                    var randomnumber = Math.floor(Math.random() * 100);
                    $('#show').text(
                            'I am getting refreshed every 3 seconds..! Random Number ==> '
                                    + randomnumber);
                }, 3000);
            });

工作場所

如果我正確理解了您的問題,則可以執行以下操作:

window.onload = function () {    
    function startTime () {
        document.getElementById('date').innerHTML = new Date();
    }
    setInterval(startTime, 1000);
}

HTML:

<div id="time">This a div containing time: <span id="date"></span></div>

我不確定我是否了解您,但這是您的意思嗎?

function startTime()
{
    document.getElementById('time').innerHTML = document.getElementById('target').innerHTML;  
}

這是我用的:

<span>This page will refresh in </span><span id="countdown">60</span>seconds&hellip;
<script type="text/javascript">
setInterval(
function() { 
    if (document.getElementById('countdown').innerHTML != 0) {
        document.getElementById('countdown').innerHTML--; 
    } else {
        window.location = window.location;
    }
}, 1000);</script>

這是一個基於原始帖子的JavaScript代碼段,用於計算自頁面加載以來的秒數,假設存在一個ID為“ time”且內容完全為數字的元素。

如果在您正在使用的頁面上以秒為單位給出剩余時間,則可以輕松地進行相應調整。 如果沒有以秒為單位給出剩余時間,則需要查看相關文本的實際外觀。

window.onload = startInterval;
var firstTime;
var valAtPageLoad; 
function startInterval()
{
    firstTime = new Date();
    valAtPageLoad = parseInt(document.getElementById('time').innerHTML);
    setInterval("startTime();",1000);
}

function startTime()
{
    var timeDiff = (new Date() - firstTime)/1000;
    document.getElementById('time').innerHTML = Math.round(timeDiff + valAtPageLoad);  
}

如果要重新加載DIV而不是整個頁面,則必須在服務器端創建該DIV的內容,然后使用AJAX加載DIV的內容。 最簡單的方法是使用jQuery:

function startTime() {
  $.get('path/to/div/contents.html', function(data) {
    $('#drawaddrow').html(data);
  });
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM