このjavascript関数は正確に何ですか？どのように私はselectから値をキャッチしてデータベースに戻しますか？

Question

PHPを使用してトリプルドロップダウンリストを作成できるajaxスクリプトを探していました。コードはかなりうまく機能しますが、AJAXやJavaScriptの初心者であるため、実際に何が起こっているのかを知りたいのですが、以下の関数が正確に何をするのか理解できません。ここでは、コードは次のとおりです。

<script language="javascript" type="text/javascript"> 

function getXMLHTTP() { //function to return the xml http object 
     var xmlhttp=false; 
     try{ 
      xmlhttp=new XMLHttpRequest(); 
     } 
     catch(e) {  
      try{    
       xmlhttp= new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
      catch(e){ 
       try{ 
       xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 
       } 
       catch(e1){ 
        xmlhttp=false; 
       } 
      } 
     } 

     return xmlhttp; 
    } 

    function getState(countryId) {  

     var strURL="findState.php?country="+countryId; 
     var req = getXMLHTTP(); 

     if (req) { 

      req.onreadystatechange = function() { 
       if (req.readyState == 4) { 
        // only if "OK" 
        if (req.status == 200) {       
         document.getElementById('statediv').innerHTML=req.responseText;      
        } else { 
         alert("There was a problem while using XMLHTTP:\n" + req.statusText); 
        } 
       }    
      }   
      req.open("GET", strURL, true); 
      req.send(null); 
     }  
    } 
    function getCity(stateId) {  
     var strURL="findCity.php?state="+stateId; 
     var req = getXMLHTTP(); 

     if (req) { 

      req.onreadystatechange = function() { 
       if (req.readyState == 4) { 
        // only if "OK" 
        if (req.status == 200) {       
         document.getElementById('citydiv').innerHTML=req.responseText;      
        } else { 
         alert("There was a problem while using XMLHTTP:\n" + req.statusText); 
        } 
       }    
      }   
      req.open("GET", strURL, true); 
      req.send(null); 
     } 

    } 
</script> 

、ここではfinsState.php

<?php 
$countryId=intval($_GET['country']); 
$host = "localhost"; 
$username = "username"; 
$password = "password"; 
$database = "test"; 
$connection = mysql_connect($host,$username,$password) or die(mysql_error()); 
$database = mysql_select_db($database) or die(mysql_error()); 
$query = "SELECT * FROM states WHERE country_id = ".$countryId; 
$result = mysql_query($query) or die(mysql_error()); 
?> 
<select name="states" onchange="getCity(this.value)"> 
<option>Select State</option> 
<?php while($row = mysql_fetch_array($result)) { ?> 
    <option value="<?php echo $row['id']; ?>"><?php echo $row['name']; ?></option> 
<?php } ?> 
</select> 

からのコードがあり、これはfindCity.php

<?php 
$stateId=intval($_GET['state']); 
$host = "localhost"; 
$username = "username"; 
$password = "password"; 
$database = "test"; 
$connection = mysql_connect($host,$username,$password) or die(mysql_error()); 
$database = mysql_select_db($database) or die(mysql_error()); 
$query = "SELECT * FROM cities WHERE state_id = ".$stateId; 
$result = mysql_query($query) or die(mysql_error()); 
?> 
<select name="city"> 
<option>Select City</option> 
<?php while($row = mysql_fetch_array($result)) { ?> 
    <option value="<?php echo $row['id']; ?>"><?php echo $row['name']; ?> </option> 
<?php } ?> 
</select> 

私の質問です：

A）誰でも第1、第2、第3のjavascript関数を要約できますか？また、findState.phpからすべての値を選択する方法はありますかnd findCity.php

b）stateIdとCityIdの値をキャッチした場合、ユーザーはどのように選択したかを選択しました。リストはJavaScriptから取り込まれているため、PHP（$ _POST ['state']）の値をキャッチできません。

Answer 1

最初の機能は、クライアント側のスクリプトがサーバーサイズのスクリプトと対話できるように、XML HTTP要求を開くことを試みています。いろいろなブラウザがこれを別々に扱うので、現代のIE実装、古いIE実装を試み、ついには諦める前に、標準的な方法を使用することができます。

第2の2つはおおよそ同じことをします。彼らは、最初に接続する関数を使用して対話したいスクリプトを定義します。接続が成功した場合は、HTTP GET要求を使用して情報を送信します（伝統的にGETは情報を取得するために使用され、POSTは設定に使用されます）。 XmlHttpRequestを使用して情報を送信すると、接続中にonreadystatechangeイベントがキーポイントで発生し、readyState（リクエストの段階を参照）とstatusにアクセスできます。 "404"は "ファイルが見つかりません"を意味します）。 「200」のステータスは「すべてが問題ありません」という意味で、スクリプトが受け取られると、スクリプトは与えられた情報に基づいて動作することができることを認識します。他の応答があれば、何が問題になったのかをユーザーに知らせるポップアップが作成されます。

このスクリプトの実際のページを見ることなく、私はstateIdとCityIdを取得する最良の方法を知らない。推測すると、特定のボタンが押されたときの入力の値になります。その場合、次のコードのようなものがあります：

document.getElementById('id-of-submit-button').onclick = function() { 
    var stateId = document.getElementById('id-of-stateid-input').value, 
     CityId = document.getElementById('id of cityid-input').value; 
};