[問題] 畫圖的問題

看板Ajax作者adddream (哆啦A孟)時間17年前 (2007/03/20 12:45)推噓1(1推 0噓 0→)

留言1則, 1人參與討論串1/6 (看更多)

總共有三個檔案分別為.js，.php，.html，名稱皆為 .js檔負責html與.php中間傳輸的過程 .php檔負責產生圖案 .html負則顯示.php檔所產生之圖案 problem:如果.php檔不是產生圖案的話，.html檔可以正常顯示，但若 .php是產生圖案的話，則.html會顯示亂碼。自己猜想問題應該是出現在.js檔下面幾行的地方 var response = xmlHttp.responseText; myDiv = document.getElementById("myDivElement"); myDiv.innerHTML = response; 因為我是經由.php產生圖，所以xmlHttp.responseText這裡所收到的內容應該是一個圖吧@@；接著myDiv.innerHTML應該是指插入HTML語言但我插入的卻不是@@，所以應該是這裡的問題。但對WEB語法不熟@@；請各位大大幫幫忙啊阿李阿鬥 ^^ 以下為程式碼 .js var xmlHttp = createXmlHttpRequestObject(); var count=0; //-----creates an XMLHttpRequest instance start---- function createXmlHttpRequestObject() { // will store the reference to the XMLHttpRequest object var xmlHttp; // this should work for all browsers except IE6 and older try { // try to create XMLHttpRequest object xmlHttp = new XMLHttpRequest(); } catch(e) { // assume IE6 or older var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0", "MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP"); for (var i=0; i<XmlHttpVersions.length && !xmlHttp; i++) { try { xmlHttp = new ActiveXObject(XmlHttpVersions[i]); } catch (e) {} } } if (!xmlHttp) alert("Error creating the XMLHttpRequest object."); else return xmlHttp; } //---------creates an XMLHttpRequest instance end------------------- function process() { //---------------count the GD number start--------------------- if(count==400) count=0; else count=count+1; //----------------count the GD number end---------------------- // -------only continue if xmlHttp isn't void start------------------- if (xmlHttp) { // try to connect to the server try { // initiate server access xmlHttp.open("GET", "proxyping.php?count=" + count, true); xmlHttp.onreadystatechange = handleRequestStateChange; xmlHttp.send(null); setTimeout('process()',100); } // display the error in case of failure catch (e) { alert("Can't connect to server:\n" + e.toString()); } } } //---------only continue if xmlHttp isn't void end-------------------- // -----function called when the state of the HTTP request changes-------- function handleRequestStateChange() { // when readyState is 4, we are ready to read the server response if (xmlHttp.readyState == 4) { // continue only if HTTP status is "OK" if (xmlHttp.status == 200) { try { // do something with the response from the server handleServerResponse(); } catch(e) { // display error message alert("Error reading the response: " + e.toString()); } } else { // display status message alert("There was a problem retrieving the data:\n" + xmlHttp.statusText); } } } // -------------function called when the state of the HTTP request changes---------- // -------------handles the response received from the server------------ function handleServerResponse() { var response = xmlHttp.responseText; myDiv = document.getElementById("myDivElement"); myDiv.innerHTML=response; } // ---------------handles the response received from the server------------------- .html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "" rel="nofollow">http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <title>Practical AJAX: Accessing Remote Server through Proxy PHP Script</title> <script type="text/javascript" src="proxyping.js"></script> </head> <body onload="process()"> <div id="myDivElement" /> </body> </html> .php <?php // load the error handling module require_once('error_handler.php'); print $count=$_GET['count']; header("Content-type:image/gif"); //設定header以讓瀏覽器將檔案視為圖檔 $im=ImageCreate(800,300); //產生一個空白圖 $red=ImageColorAllocate($im,0,0,255); //第一個ImagecolorAllocate決定背景顏色 $white=ImageColorAllocate($im,255,0,255); $yellow=ImageColorAllocate($im,255,255,255); // Imageline($im,1,255,1,$array_line[0],$yellow); //為一線條影像，im像是一個容器，Imageline像是內容物;前面四個數字表示 //x,y啟始位址與結束位置 $fp=fopen("Menu.txt","r"); $j=0; while($line=fgets($fp,$count)) { $array_line=explode(' ',$line); //using the explode function divide the line from string to arry. for($i=0,$num_count=count($array_line);$i<$num_count;$i++) { Imageline($im,(2+$i*1.5+$j*1.5),275,(2+$i*1.5+$j*1.5),275-$array_line[$i],$yellow); } $j=$j+$i; Imagestring($im,5,$j+50,$j+50,$j,$yellow); } Imagegif($im); //輸出圖檔 ImageDestroy($im); //消毀圖片 ?> -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 140.122.79.88