<script language="javascript" type="text/javascript">
var req;

function loadXMLDoc(url, parameters)
{
   // branch for native XMLHttpRequest object
   if (window.XMLHttpRequest) {
       //alert("window.XMLHttpRequest");
       req = new XMLHttpRequest();
       req.onreadystatechange = processReqChange;
       req.open("POST", url, true);
       req.setRequestHeader('Connection', 'close');
       req.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
       req.send(parameters);
       return;
   }
   // branch for IE/Windows ActiveX version
    if (window.ActiveXObject) {
       //alert("window.ActiveXObject");
       req = new ActiveXObject("Microsoft.XMLHTTP");
       if (req) {
           req.onreadystatechange = processReqChange;
           req.open("POST", url, true);
           req.setRequestHeader('Connection', 'close');
           req.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
            req.send(parameters);
           return;
       }
   }
   alert("Sorry,Your Browse is so old.");

}

function PreviewMe(input, response)
{
 if (response != ''){
   // Response mode
   message = document.getElementById('ShowitBar');
   message.innerHTML = response;
 }else{
   // Input mode
   url  = 'leobbs.cgi';
   loadXMLDoc(url,'');
 }
}

function processReqChange()
{
  //  only if req shows "complete"
   if (req.readyState == 4) {
       // only if "OK"
       if (req.status == 200) {

     response  = req.responseText;

     PreviewMe('', response);

       } else {
           alert("There was a problem retrieving the XML data:\n" + req.statusText);
       }
   }
}
</script>



<form>
<input type='button' onclick="PreviewMe('','');" value='Preview Me'>
</form>


<div id="ShowitBar" style='background: #FFF; color:#000;padding: 1em'></div>

其中含义自己慢慢领悟：）

PS: 这里有个详细的解释 ：

http://www.fayland.org/journal/Ajax_preview.html （非四的PerlSite）