[問題]怎麽自動更新來自另一個網址的JSON

看板Ajax作者 (letmein)時間8年前 (2016/11/29 22:35), 編輯推噓7(7022)
留言29則, 4人參與, 最新討論串1/3 (看更多)
我想做兩件事 1.取出網頁內容JSON,拆到元件 2.傳給另一個網頁呈現, 所以想一起問 JS跟AJAX都很菜,只有google的程度,不好意思 我寫了個JSP會由網址輸入不同參數改變輸出的JSON, 網址為 140.138.77.151:8080/personalAssementNEW 會輸出以下網頁 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Page</title> </head> <body> [{"UID":999999,"UrlDate":"2015-11-24","SleepQ":70,"SleepQ_Lab":"普通 ","AttLevel":43.2864439246683,"AttLevel_Lab":"普通 ","MemLevel":60,"MemLevel_Lab":"普通"}] <h1></h1> </body> </html> 想取出其中這段JSON的元件,呈現至另一個網頁上 [{"UID":999999,"UrlDate":"2015-11-24","SleepQ":70,"SleepQ_Lab":"普通 ","AttLevel":43.2864439246683,"AttLevel_Lab":"普通 ","MemLevel":60,"MemLevel_Lab":"普通"}] 我找了w3c範例套用看看但沒有東西,如以下: $(document).ready(function(){ $("button").click(function(){ $.get("140.138.77.151:8080/personalAssementNEW/", function(data, status){ alert("Data: " + data + "\nStatus: " + status); }); }); }); 發現需要"Access-Control-Allow-Origin",修改後另一個試著寫的JS可以讀出網頁結果 但是AJAX還是不能解元件: <!DOCTYPE html> <html> <body> <div id="id01"></div> <script> var xmlhttp = new XMLHttpRequest(); /*var url = "http://www.w3schools.com/website/Customers_MYSQL.php";*/ var url; url = "http://140.138.77.151:8080/personalAssementNEW/getAssement.jsp?ID=999999&DATEINFO=2015-11-24&TIMEINFO=15:00:00"; xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { myFunction(xmlhttp.responseText); } } xmlhttp.open("GET", url, true); xmlhttp.send(); function myFunction(response) { document.getElementById("id01").innerHTML = response; var obj = JSON.parse(response); document.getElementById("id01").innerHTML = obj[0].AttLevel + " " + obj[0].AttLevel_Lab; } </script> </body> </html> 他只會輸出[{.....}],我後面的 obj[0].AttLevel 就不理我了。之前用靜態網頁是OK的 所以想請教怎麽取得JSON(應該要用AJAX?)自動隨著網址的內容更新 呈現在另一個網頁上 如果有很小白的部分請多包容,謝謝 問題同時於以下詢問,但是可能太菜沒人理我XDrz https://stackoverflow.com/questions/40856472/how-can-i-auto-update-a-web-pages-json-content-by-ajax -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 140.138.148.133 ※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1480430148.A.D2E.html

11/30 03:11, , 1F
Window.postMessage() 我沒試過就是了
11/30 03:11, 1F

11/30 03:13, , 2F
或jsonp吧
11/30 03:13, 2F

11/30 03:29, , 3F
好怪的東西,既然是json何必塞在html裡面@@
11/30 03:29, 3F

11/30 03:32, , 4F
這年頭ajax沒必要自己刻,用jQuery之類比較快
11/30 03:32, 4F

11/30 03:54, , 5F
可以多指點一點嗎?我對JS,AJAX了解只有查W3C的程度,
11/30 03:54, 5F

11/30 03:54, , 6F
不知道怎麼做我想要的更好
11/30 03:54, 6F

11/30 03:56, , 7F
jquery昨天找範例改東西也出不來
11/30 03:56, 7F

11/30 03:56, , 8F
之前寫java的,網頁沒有錯誤訊息不太知道怎麼修@@
11/30 03:56, 8F

11/30 09:12, , 9F
http://jsfiddle.net/vobmzdgr/4/ 差不多是這種感覺
11/30 09:12, 9F

11/30 09:26, , 10F
1. 你的 cors 這樣寫不行,必需下在server端
11/30 09:26, 10F

11/30 09:26, , 11F
放meta沒用的
11/30 09:26, 11F

11/30 09:27, , 12F
2. json 外面沒必要多包html的東西,json尾也多了h1
11/30 09:27, 12F

11/30 09:27, , 13F
正常只要二行就完成了,一行ajax,二行解json
11/30 09:27, 13F

11/30 09:28, , 14F
或是ajax裡直接指定json型態,一行就完成 :D
11/30 09:28, 14F

11/30 14:12, , 15F
感謝!只是您給的網址js html要怎麼一起用?html指定嗎
11/30 14:12, 15F

11/30 14:12, , 16F
11/30 14:12, 16F

11/30 14:13, , 17F
response.addHeader("Access-Control-Allow-Origin", "*
11/30 14:13, 17F

11/30 14:15, , 18F
1.如上 2.剛試著把html mark掉,網頁就不能跑了
11/30 14:15, 18F

11/30 14:28, , 19F
了解,可以出乾淨json了,怎像連結出收到的內容:
11/30 14:28, 19F

11/30 14:28, , 20F
解算等還不太明白
11/30 14:28, 20F

11/30 15:41, , 21F
好像可以了,可以定期更新嗎?確保跟json變動同步
11/30 15:41, 21F

11/30 17:08, , 22F
定期?最簡單就設setInterval讓程式一直loop
11/30 17:08, 22F

11/30 18:15, , 23F
http://jsfiddle.net/vobmzdgr/7/ 像這樣嗎?感謝!
11/30 18:15, 23F

11/30 20:04, , 24F
對,這樣可以
11/30 20:04, 24F

11/30 20:47, , 25F
感謝,想再問一下 jquery有比js更簡單取json元件的方式
11/30 20:47, 25F

11/30 20:47, , 26F
嗎?
11/30 20:47, 26F

12/01 14:51, , 27F
看不大懂這個問題是什麼,你覺得jquery跟js哪個是大哥
12/01 14:51, 27F

12/01 16:54, , 28F
好像JQuery是JS的一種 JQuery比較好用 可是要引用的感覺
12/01 16:54, 28F

12/01 16:54, , 29F
手機沒有推出來@@
12/01 16:54, 29F
文章代碼(AID): #1OFP94qk (Ajax)
文章代碼(AID): #1OFP94qk (Ajax)