iT邦幫忙

0

關於將txt檔載入網頁表格內的網頁

d32302 2014-11-24 09:45:3512419 瀏覽

小弟最近在寫一個動態載入資料
算是屬於類似悠遊卡動態載入資料吧
小弟想說先寫一個從外部的txt檔的資料
動態載入到網頁表格內
也就是
每當讀取時
最新的時間排在最上面
下面圖是小弟的想法
http://ppt.cc/hqiN@.jpg
小弟上網google一下
發現好像沒有類似動態載入資料
不過有提到
用javascript和htm去寫應該就可以寫出來
再加上css語法編修表格就可以了
不過小弟只會編修基本htm和css網頁語法 javascript才剛接觸
所以小弟上來請教各位大大
該如何撰寫動態再載入資料呢^^"

2
weiclin
iT邦高手 7 級 ‧ 2014-11-24 11:04:49

你所謂的 "外部的txt檔" 是放在哪裡?
如果是在使用者電腦裡, 那就沒辦法自動載入
如果是放在網站上, 那就用 ajax 去讀取, 再把文字欄位拆好填入表格

d32302 iT邦新手 5 級 ‧ 2014-11-24 11:25:50 檢舉

weiclin提到:

你所謂的 "外部的txt檔" 是放在哪裡?
如果是在使用者電腦裡, 那就沒辦法自動載入
如果是放在網站上, 那就用 ajax 去讀取, 再把文字欄位拆好填入表格

如果是在電腦有一個資料夾裡面有txt檔要讀取呢
依舊是沒辦法自動載入嗎
另外
用ajax去讀取....
由於小弟接觸htm時間較javascript久
javascript最近才碰到
之前都是複製貼上居多xD
所以ajax不懂該如何去寫
請教大大是否有類似的程式碼提供小弟參考?

weiclin iT邦高手 7 級 ‧ 2014-11-24 16:25:50 檢舉

你如果一定要讀取本機的檔案, 那就一定要讓使用者去選取要開啟的檔案
在網頁上面放一個按鈕, 點下去開啟檔案選單, 或是用拖曳的方式
總之沒辦法作到網頁一開啟就自動讀取檔案, 這是瀏覽器的安全性原則

weiclin iT邦高手 7 級 ‧ 2014-11-24 16:42:04 檢舉

所以, 你要嘛就是把 txt 檔也都上傳到網頁空間去
不然就是用下面這個教學的方法去選取檔案再讀取
http://www.html5rocks.com/en/tutorials/file/dndfiles/

0
丁丁 (Dean)
iT邦大師 6 級 ‧ 2014-11-24 13:30:06

d32302提到:
http://ppt.cc/hqiN@.jpg

這邊提供一個用 JavaScript 讀取 CSV 序列資料給你參考...
Javascript code to parse CSV data

d32302 iT邦新手 5 級 ‧ 2014-11-24 14:58:49 檢舉

deanya提到:

這邊提供一個用 JavaScript 讀取 CSV 序列資料給你參考...
Javascript code to parse CSV data

小弟想說用txt檔做載入讀取動作
csv檔會不會太複雜?
另外
小弟看了大大提供的網址
好像沒提到htm的網頁語法

d32302提到:
好像沒提到htm的網頁語法

<pre class="c" name="code"><script type="text/javascript">
略...
</script>
0
gituest
iT邦新手 5 級 ‧ 2014-12-14 13:32:57

只要網頁不用太及時反映資料,資料量沒超過1百萬筆..
可以用每幾分鐘 reload 網頁更新資料就好

可以把 資料 txt檔 當作是 javascript 的外部檔使用就好
<script src=record.txt></script>

record.txt檔內資料
當作是 rec=function 的 /* */註解

可參考如何設定多行字串的討論
http://stackoverflow.com/questions/805107/creating-multiline-strings-in-javascript

多行資料抓出來 用空白或隔行溤分入震裂 split("\n\r")

再用日期 排序 sort 重新排好資料時序
參考問與達
http://ithelp.ithome.com.tw/question/10017886

最後把資料填放入表格即可

0
hanigogo
iT邦新手 3 級 ‧ 2015-01-02 17:05:32
  1. 資料從哪裡load進來,如果是固定的檔案,上傳到某個空間裡,修正TXT檔內容直接覆蓋掉檔案就好,如果不是固定的檔案,就讓USER可以上傳到你的空間裡

  2. 觀察文字與文字之間用什麼分隔,例如TAB,逗號

  3. 使用迴圈一行一行讀取,塞進表格

我要發表回答

立即登入回答