使用ajax沒有響應的代碼預覽

我想要做到以下幾點：當用戶按下預覽按鈕時，突出顯示的語法代碼使用AJAX顯示，但它不起作用。我在做什麼錯？這裏有三個代碼：的index.html：使用ajax沒有響應的代碼預覽

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
    <head> 
    <script type="text/javascript" src="preview.js"></script> 
    <meta http-equiv="content-type" content="text/html; charset=windows-1250"> 
    <title>Test Code Preview</title> 
    </head> 
    <body> 
     <textarea id="pastecode" rows="20" cols="50" name="pastecode"></textarea> 
     <br /><input type="text" id="language" name="language"/> 
     <br /><input type="button" onclick="process()" value="Preview"/> 
     <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 
     <div id="previewcode"></div> 
    </body> 
</html>

preview.js：

var xmlHttp= createXmlHttpRequestObject(); 

function createXmlHttpRequestObject(){ 
    var xmlHttp; 

    if(window.ActiveXObject){ 
     try{ 
     xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     }catch(e){ 
      xmlHttp =false; 
      } 
     }else{ 
     try{ 
      xmlHttp= new XMLHttpRequest(); 
      }catch(e){ 
       xmlHttp =false; 
       } 
     } 
     if(!xmlHttp) 
      alert("cant create that object hoss!"); 
     else 
      return xmlHttp; 
    } 

function process(){ 
    if(xmlHttp.readyState==0 || xmlHttp.readyState==4){ 
     code=encodeURIComponent(document.getElementById("pastecode").value); 
     language=encodeURIComponent(document.getElementById("language").value); 
     xmlHttp.open("POST", "preview.php", true); 
     xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); 
     xmlHttp.onreadystatechange = handleServerResponse; 
     xmlHttp.send("pastecode="+code+"&language="+language); 
     } 
    } 


function handleServerResponse(){ 
    if(xmlHttp.readyState==4){ 
      if(xmlHttp.status==200){ 
       xmlResponse=xmlHttp.responseXML; 
       xmlDocumentElement=xmlResponse.documentElement; 
       code=xmlDocumentElement.firstChild.data; 
       document.getElementById('previewcode').innerHTML=code; 
     } 
     } 
    }

preview.php：

<?php 
header('Content-Type: text/xml'); 
echo '<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>'; 

echo '<response>'; 
    $code=$_POST['pastecode']; 
    $language=$_POST['language']; 
    include("geshi/geshi.php"); 
    $path  = ''; 
    $geshi = new GeSHi($code, $language, $path); 
    $geshi->set_overall_style('background-color: #ffffee;', true); 
    $out = $geshi->parse_code(); 
    echo htmlentities($out); 
echo '</response>'; 
?>

正在發生的事情是，我填補了用於pastecode的文本框和用於語言的文本框並單擊該按鈕，但沒有響應。我正在使用Firefox。

來源

2013-07-03 user2007130

對於Ajax請求，您應該使用像JQuery這樣的庫。這樣，您就不必擔心不同瀏覽器和瀏覽器版本之間的差異。

什麼preview.js可能看起來像示例：

function process(){ 

    $.ajax({ 
     url: "preview.php", 
     type: "post", 
     data: { 
      pastecode: $("pastecode").val(), 
      language: $("language").val() 
     }, 
     success: function(data){ 
      $("#previewcode").html(data); 
      //Or handle data with jQuery.parseXML() 
     }, 
     error:function(jqXHR, textStatus, errorThrown){ 
      alert("The following error occured: " + textStatus + " " + errorThrown); 
     } 
    }); 

}

來源

2013-07-03 10:25:23

我不認爲由於瀏覽器不兼容它不工作。我已經使用相同的Firefox爲其他一些簡單的Ajax代碼。我認爲在我的代碼邏輯中存在一些錯誤。這就是爲什麼它不工作。 – user2007130

使用ajax沒有響應的代碼預覽

回答

相關問題