jquery ajax戻り値を取得

Question

私はhtmlページの '印刷された値'を取得したい。

私は、クエリの下にしようとしたが、showGetResult（）は単に「null値」

を返すが、私のApacheサーバのログは、私はこのコードをしようとしたとき、私はindex.phpのアクセス印刷。

（index.phpを単に印刷のHelloWorld）

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"><\script> 
<script type="text/javascript"> 
function showGetResult(name) 
{ 
    var result = null; 
    jQuery.ajax({ 
     url: 'http://localhost/index.php', 
     type: 'get', 
     dataType: 'text/html', 
     success:function(data) 
     { 
      alert(data); 
      result = data; 
     } 
    }); 
    return result; 
} 

document.write(showGetResult('test')); 
</script> 

Answer 1

あなたがしたいことはこれだと思います。

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"><\script> 
<script type="text/javascript"> 
function showGetResult(name) 
{ 
    jQuery.ajax({ 
     url: 'http://localhost/index.php', 
     type: 'get', 
     dataType: 'text/html', 
     success:function(data) 
     { 
      alert(data); 
      document.write(data); 
     } 
    }); 
} 

showGetResult('test'); 
</script> 

Answer 2

AJAX要求は、デフォルトでaynchronousです。その結果を関数に返すことができない場合は、コールバックを使用する必要があります。あなたが望むものを達成するための最も簡単な方法は、あなたのsuccessハンドラでデータを処理するコードを置くことです：

success:function(data) 
    { 
     alert(data); 
     result = data; 
     document.write(showGetResult('test')); 
    } 

また、document.writeを使用しないでください。

Answer 3

これは、AJAXが動作する方法です（名前が示すように非同期に動作します）。 showGetResult関数は、AJAX呼び出しが完了する前に戻ります。 showGetResultはnullを返します。これはresultに割り当てられているためです。

successコールバック内でAJAX呼び出しの結果に依存するコードを移動します。あるいは、コールを同期させることもできますが、通常はそうではありません。

Answer 4

あなたはjQuery.ajaxのドキュメントごとに間違ったdataTypeを持っている：

"HTML"：プレーンテキストとしてHTMLを返します。含まれているスクリプトタグは、DOMに挿入されると評価されます。

だから、htmlを使用したい：

また

... 
dataType: 'html', 
... 

---

、他の人が言ってきたように、AJAXリクエストが非同期です。したがって、コードを再構成する必要があります。たとえば、

function showGetResult(name) 
{ 
var result = null; 
jQuery.ajax({ 
    url: 'http://localhost/index.php', 
    type: 'get', 
    dataType: 'html', 
    success:function(data) 
    { 
     alert(data); 
     result = data; 
     document.write(result); 
    } 
}); 
} 

showGetResult('test'); 

Answer 5

ここでは基本的な欠点があります。 showGetResultを呼び出すと、successメソッドは実行されません。それは実行されますasynchronously。

return result;を入力した時点ではまだ無効です（successはまだ呼び出されていないため）。

あなたがしなければならないことは、成功が呼び出された後にdocument.writeを実行させることです。このいずれかのように：

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"><\script> 
<script type="text/javascript"> 
function showGetResult(name) 
{ 
    var result = null; 
    jQuery.ajax({ 
     url: 'http://localhost/index.php', 
     type: 'get', 
     dataType: 'text/html', 
     success:function(data) 
     { 
      alert(data); 
      document.write(data); 
     } 
    }); 
    return result; 
} 

//document.write(showGetResult('test')); 
showGetResult('test'); 
</script> 

またはコールバックを持つ：

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"><\script> 
<script type="text/javascript"> 
function showGetResult(name) 
{ 
    var result = null; 
    jQuery.ajax({ 
     url: 'http://localhost/index.php', 
     type: 'get', 
     dataType: 'text/html', 
     success:function(data) 
     { 
      alert(data); 
      writeToDocument(data); 
     } 
    }); 
} 

function writeToDocument(data) { 
    document.write(data); 
} 

showGetResult('test'); 
</script> 

Answer 6

のではなく、関数が返すことを期待するものにdocument.writeを使用して、成功コールバックはそうのように、あなたのための世話をすることができます。

success:function(data) { 
    document.write(data); 
}