0

Web サイトのコンテンツを非同期で取得したいと考えています。サーバーに複数のリクエストがあるので、「接続スタッフ」を別の機能に分離するのは素晴らしいことだと思いました。

function conToServerAsync( url, postParams, func )
{
   var xmlHttp;
   if( window.XMLHttpRequest )
   {
      xmlHttp = new XMLHttpRequest();
   }
   else
   {
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
   }
   xmlHttp.onreadystatechange = func;
   xmlHttp.open("POST", url, true);
   xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
   xmlHttp.setRequestHeader("Connection", "close");
   xmlHttp.send(postParams);
}

今、私はこのような「conToServerAsync」関数を実行しているこの他の関数を持っています:

function findSearchResult(value)
{
  conToServerAsync( "Classes/Async/liveSearch.php", "sVal="+value, function()
  {
    if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
    {
    document.getElementById("searchResult").innerHTML = xmlHttp.responseText;
    document.getElementById("searchResult").style.border="1px solid #A5ACB2";
    }
  });
}

私のケースで実際に興味深いのは、すべてをチェックし、渡されたすべてのパラメーターが有効であることです。次に、最後のパラメーター "conToServerAsync( "Classes...", "sVal..", function(){...}" で指定された関数を onreadystatechange に直接割り当てようとしました。

...
xmlHttp.onreadystatechange = function()
        {
            if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
            {
            document.getElementById("searchResult").innerHTML = xmlHttp.responseText;
            document.getElementById("searchResult").style.border="1px solid #A5ACB2";
            }
      }

...そしてそれは完全に機能します:Sしたがって、間違いなくエラーは関数を間違った方法で渡すことに関するものであり、私にはわかりません。私の場合は、それについて独自の質問をした特定のものです。

答えてくれてありがとう ：）

4

3 に答える 3

2

コールバックから使用しようとしてxmlHttpいますが、範囲外です。次のアプローチをお勧めします。

function conToServerAsync( url, postParams, func )
{
   var xmlHttp;
   if( window.XMLHttpRequest )
   {
      xmlHttp = new XMLHttpRequest();
   }
   else
   {
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
   }
   xmlHttp.onreadystatechange = function() {
      if(xmlHttp.readyState == 4 && xmlHttp.status == 200) {
         func.call(xmlHttp, xmlHttp);
      }
   }
   xmlHttp.open("POST", url, true);
   xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
   xmlHttp.setRequestHeader("Connection", "close");
   xmlHttp.send(postParams);
}

function findSearchResult(value)
{
  conToServerAsync( "Classes/Async/liveSearch.php", "sVal="+value, function(xhr)
  {
    document.getElementById("searchResult").innerHTML = xhr.responseText;
    document.getElementById("searchResult").style.border="1px solid #A5ACB2";
  });
}
于 2013-04-02T21:38:47.710 に答える
0

渡した関数はコンテキストとしてxmlHttp.onreadystatechange呼び出されるため、そのオブジェクトを参照するために使用できます。xmlHttpthis

function findSearchResult(value)
{
  conToServerAsync( "Classes/Async/liveSearch.php", "sVal="+value, function()
  {
    if(this.readyState == 4 && this.status == 200)
    {
    document.getElementById("searchResult").innerHTML = this.responseText;
    document.getElementById("searchResult").style.border="1px solid #A5ACB2";
    }
  });
}
于 2013-04-02T22:16:53.310 に答える