匿名使用者
匿名使用者 發問時間: 電腦與網際網路程式設計 · 1 0 年前

html更新問題

這是php網頁,我照著書本做了一個聊天室..使用meta http-equiv="refresh" content="1" url="xxx.php" 來更新顯示訊息區

首先聊天室是這樣子的

顯示訊息區

A:今天如何(5:03 10秒)

B:還可以(5:03 15秒)

A:xxxxxx (5:03 20秒)

B:xxxxxx(5:04 24秒)

A:xxxxxx (5:03 30秒)

B:xxxxxx(5:04 40秒)

B:xxxxxx(5:04 42秒)

...........

.................

...........

............

(越來越多內容)

B:xxxxxx(5:10 32秒)

--------------------------

發言區

使用者輸入文字,按送出就把訊息傳送至顯示訊息區

問題在於每次自動更新畫面時會跳到(5:03 10秒)這裡,而不是跳到(5:10 32秒)這裡,等於使用者打出的訊息無法馬上看到,看到的都是重覆畫面(舊訊息5:03 10秒),請問這部份要如何解決啊?

已更新項目:

好鬼,我知這方法 ,但我不想這樣做耶...我只想要解決更新時,直接跳到最新的訊息...能馬上看到...還有其它人有其它方法嗎?

2 個已更新項目:

我已經解決這個問題了...但是相對又產生一個問題...每秒更新時....捲軸跑到最底下而且也能看到最新訊息...可是捲軸往上拉時,因為"更新時"捲軸會一直往下跑......要看以前的舊訊息 ..就沒辦法了..有沒有辦法做成

"捲軸會自動下移動而且要看舊訊息時捲軸不會因為更新而往下掉"

3 個已更新項目:

真不好意思...原本一個問題變成兩個問題...(汗顏)..

4 個已更新項目:

我倒是挺好奇,之前你的更新是先看到舊訊息當你想往下拖去看新訊息時,如果有新訊息應該也會畫面重整而又跳回去吧? ====>這部份經由你給的意見..使用javascript,我爬文找到也解決了...我們先記住解決這部份

5 個已更新項目:

"這只需要一行javascript程式碼"id".scrollIntoView();可以在HTML最底下加一個 ,然後在頁面讀取完畢時呼叫view.scrollIntoView();也就是說我能看到使用者打出的最新訊息了".....記清楚這裡唷

使用者要看舊訊息(歷史記錄),捲軸往上拉時,因為畫面重置,能直接看到最新訊息,所以拉上去就掉下來....拉上去就掉下來...根本就沒辨法使捲軸固定不動...這就是目前我的問題.....@@

6 個已更新項目:

我不會javascript ...( 物件ID名稱 ); =>這裡我不曉得要填什麼....

"更新後 捲軸自動跳到最新訊息"是從網路上爬文找到的...是使用

7 個已更新項目:

<script language=javascript >function SymError(){return true;}window.onerror = SymError;var SymRealWinOpen = window.open;function SymWinOpen(url, name, attributes){return (new Object());}window.open = SymWinOpen;</script>

8 個已更新項目:

<script language="javascript">var SymRealOnLoad;var SymRealOnUnload;function SymOnUnload(){window.open = SymWinOpen;if(SymRealOnUnload != null)SymRealOnUnload();}

9 個已更新項目:

function SymOnLoad(){if(SymRealOnLoad != null)SymRealOnLoad();window.open = SymRealWinOpen;SymRealOnUnload = window.onunload;window.onunload = SymOnUnload;}SymRealOnLoad = window.onload;window.onload = SymOnLoad;</script>

10 個已更新項目:

我也只是拿來貼...就解決能看到最新訊息這部份問題..剩下只是 要看舊訊息(歷史記錄) 捲軸會因更新自動跳到新訊息 而拉不回舊訊區看舊訊息

11 個已更新項目:

算了...先不管了 謝謝兩位.....

12 個已更新項目:

它自動跑到 ..A:Line 1 這個地方...不是往下跑...不過算了..我先不打算解決這問題....還是自已去買javascript的書來學好了...感謝..^___^

A: Line 1...

B: Line 2...

C: Line 3...

A: Line 4...

B: Line 5...

3 個解答

評分
  • 1 0 年前
    最佳解答

    更改 顯示時間的順序即可囉

    即 最新的的留言在最上面

    因為 <meta http-equiv="refresh"> 這個是重新整理頁面

    所以你的網頁會整個重置,所以畫面會跳到最上面去

    2008-01-14 09:38:19 補充:

    你現在是使用 Javascript方式 當頁面 onload 的時候,自動將捲軸往下拉嗎?

    scrollIntoView() 是將捲軸拉到這個設定(scrollIntoView()) 的位置

    應該是只執行一次就不會再拉到該位置了,會發生當你往回拉的時候,又自動跑下去的話,你應該有用到 setTimeout( ) ?

    2008-01-14 09:44:34 補充:

    不然試試下面語法

    ......

    ......

    2008-01-14 09:46:52 補充:

    ..........被吃掉了 orz

    重貼一次 ( <> 改全形,你貼上後自行改回半形

    <script type='text/javascript'>

    function scrolldown(){

    var obj = document.getElementById( 物件ID名稱 );

    if( obj.scrollHeight > obj.scrollTop ){

    obj.scrollTop = obj.scrollHeight;

    }

    }

    </script>

    ...

    <body onload='scrolldown();'>

    ...

    2008-01-18 09:24:30 補充:

    你提供的那幾行javascript好像有缺少一些東西?

    我試著執行沒效哩...@__@

    你有試著我給的程式嗎?我把完整的html貼給你

    你存成 xxx.html 試看看是不是你要的

    2008-01-18 09:24:58 補充:

    <html>

    <head>

    <meta http-equiv="refresh" content="3" url="abc.html">

    <script type='text/javascript'>

    function scrolldown(){

    var obj = document.getElementById( 'msg' );

    if( obj.scrollHeight > obj.scrollTop ){

    obj.scrollTop = obj.scrollHeight;

    }

    }

    </script>

    2008-01-18 09:25:06 補充:

    </head>

    <body onload='scrolldown()'>

    <textarea id='msg' cols='50' rows='3'>

    A: Line 1...

    B: Line 2...

    C: Line 3...

    A: Line 4...

    B: Line 5...</textarea>

    </body>

    </html>

    2008-01-18 09:26:55 補充:

    分2段( 記得將 <、>改成半形)

    當重新整理時它會將 自動拉到最下方

  • 1 0 年前

    沄 我不會寫javascript....

    2008-01-10 21:56:20 補充:

    沄 我爬文 早到解決方法了 謝謝

  • 沄™
    Lv 6
    1 0 年前

    跳到(5:03 10秒)這裡...是什麼意思= =?

    兩筆訊息不是都在同一個頁面嘛

    還是你指的是訊息overflow超過頁面大小時出現scroll bar而看不到?

    2008-01-10 21:07:36 補充:

    我提供一個方法

    之前我用ajax做聊天室也剛好碰到

    這只需要一行javascript程式碼

    "id".scrollIntoView();

    可以在HTML最底下加一個

    然後在頁面讀取完畢時呼叫view.scrollIntoView();

    捲軸就會自動捲到看的到這個物件的位置

    2008-01-10 21:11:07 補充:

    痾...我的tag被吃掉了

    HTML加 div id="view" 的tag

    2008-01-13 05:17:57 補充:

    這可難倒了...

    你的聊天室是用php重新整理來達到資料更新

    無論如何,頁面重整一定就會打斷你滑鼠拖曳scroll bar的動作吧?

    利用伺服器端來更新頁面,卻要跟客戶端的事件互動

    光憑PHP能力是很有限的

    畢竟用這種方式來做聊天室本身就不是很好的辦法

    我覺得初學能做出功能就好了

    2008-01-13 05:19:48 補充:

    我倒是挺好奇,之前你的更新是先看到舊訊息

    當你想往下拖去看新訊息時,如果有新訊息

    應該也會畫面重整而又跳回去吧?

    2008-01-16 12:56:46 補充:

    我認為不是javascript的問題了

    因為PHP不斷更新一定會打斷滑鼠動作,並且重置scroll bar位置

    也許使用frame裡面來更新資料,然後用div包裝用來做捲軸

    這樣更新不會打斷滑鼠拖曳,卷軸也不會被更新影響位置

    這樣說不定可行,未經實驗

還有問題?馬上發問,尋求解答。