jQueryの - グローバル変数にAJAXの応答を保存します
質問
イムをまだ多少jQueryとAJAXのシーンで初心者のが、私は、ユーザーがそのページに費やすしかし期間のため、いくつかのXMLファイル(〜6キロバイト以下)を取得するためにGETを実行$アヤックスの要求を持っていますXMLコンテンツは/変更されませんべきではありません(私は変更することはできません。この設計を、私はまた、私はどこか別の場所からそれを読んでいるようなXMLファイルを変更するためのアクセス権を持っていません)。したがって、私は私がに応答データを保存するグローバル変数を持ち、データ上の任意のその後のルックアップは、この変数に行われますので、複数の要求を行う必要がありません。
XMLファイルを増やすことができるという事実を考えると、イムはわからないこれがベストプラクティスであり、また、グローバルパブリック変数への私の考えでは、一般的にJavaの背景から来ているノーノーます。
ありませんだから私は持っている問題は、これを行うには良い方法、およびファイルは、いくつかのばかげたファイルサイズに出て拡張した場合、これは任意のメモリの問題を引き起こすかどうかに疑問があるかもしれないかどうか?
私は、データが私のグローバルパブリック変数の問題を解決するだろうXMLオブジェクト、内部のいくつかのゲッター/セッタータイプの関数に渡されたが、それでも私は、オブジェクト自体の内部応答を保存する必要があるかどうかに疑問を提起することができ把握します。
たとえば、私が現在やっていることはあります:
// top of code
var xml;
// get the file
$.ajax({
type: "GET",
url: "test.xml",
dataType: "xml",
success : function(data) {
xml = data;
}
});
// at a later stage do something with the 'xml' object
var foo = $(xml).find('something').attr('somethingElse');
解決
それを格納する以外に、その周りに方法はありません。メモリのページングがある潜在的な問題を軽減する必要があります。
私はもっとこのような何かを、代わりに「XML」と呼ばれるグローバル変数を使用することをお勧めします:
var dataStore = (function(){
var xml;
$.ajax({
type: "GET",
url: "test.xml",
dataType: "xml",
success : function(data) {
xml = data;
}
});
return {getXml : function()
{
if (xml) return xml;
// else show some error that it isn't loaded yet;
}};
})();
、その後でそれにアクセス
$(dataStore.getXml()).find('something').attr('somethingElse');
他のヒント
ここでは非常によく仕事をして機能があります。私は仕事に上記最良の答えを得ることができませんでした。
jQuery.extend({
getValues: function(url) {
var result = null;
$.ajax({
url: url,
type: 'get',
dataType: 'xml',
async: false,
success: function(data) {
result = data;
}
});
return result;
}
});
そして、そのような変数を作成し、それをアクセスします
var results = $.getValues("url string");
これは私のために働いてます:
var jqxhr = $.ajax({
type: 'POST',
url: "processMe.php",
data: queryParams,
dataType: 'html',
context: document.body,
global: false,
async:false,
success: function(data) {
return data;
}
}).responseText;
alert(jqxhr);
// or...
return jqxhr;
global: false
、async:false
を、最終的にresponseText
要求にチェーン$.ajax
:重要注意します。
あなたは、このいずれかを行う必要はありません。私は私のプロジェクトと同じ問題に遭遇しました。何をやっていることは、グローバル変数をリセットするには、成功した場合に、コールバック内の関数呼び出しを行うことです。限り、あなたはfalseに設定された非同期JavaScriptを得たとして、それが正常に動作します。ここに私のコードです。それがお役に立てば幸いです。
var exists;
//function to call inside ajax callback
function set_exists(x){
exists = x;
}
$.ajax({
url: "check_entity_name.php",
type: "POST",
async: false, // set to false so order of operations is correct
data: {entity_name : entity},
success: function(data){
if(data == true){
set_exists(true);
}
else{
set_exists(false);
}
}
});
if(exists == true){
return true;
}
else{
return false;
}
これはあなたを助けることを望みます。
あなたはそれが簡単に、彼らはグローバルにアクセスしているとして、DOM要素に応答値を格納するかもしれません
<input type="hidden" id="your-hidden-control" value="replace-me" />
<script>
$.getJSON( '/uri/', function( data ) {
$('#your-hidden-control').val( data );
} );
</script>
これはfalseに非同期に設定する必要がないという利点があります。明らかに、これが適切であるかどうかはあなたが達成しようとしているかに依存します。
あなたの問題は、「成功」機能を実行し、あなたの変数からデータを取り出ししようとしている時間の間だけサーバ遅延そのことについては任意のローカルまたはグローバルスコープに関連していない可能性があります。
チャンスはあなたがアヤックス「成功」機能火災前に変数の内容を印刷しようとしているされます。
function getJson(url) {
return JSON.parse($.ajax({
type: 'GET',
url: url,
dataType: 'json',
global: false,
async: false,
success: function (data) {
return data;
}
}).responseText);
}
var myJsonObj = getJson('/api/current');
これは!!!作品
function get(a){
bodyContent = $.ajax({
url: "/rpc.php",
global: false,
type: "POST",
data: a,
dataType: "html",
async:false
}
).responseText;
return bodyContent;
}
は、あまりにもこれに走りました。回答の多くは、まだ、私は行くよ一つだけの単純な正しいものを提供します。キーが$アヤックスのcall..syncを作ることです!
$.ajax({
async: false, ...
私は本当にイベントの「document.ready」の段階で私の変数にjQueryのAJAXの結果を得るに苦労しました。
ページがすでにロードされた後、ユーザが選択ボックスの「のonchange」イベントをトリガしたときにjQueryのAJAXのは、私の変数にロードしますが、ページが最初にロードされたときのデータは、変数を供給しません。
私は多くの、多くの、多くの異なる方法を試してみましたが、最終的に、それは私のために最善を働いていたチャールズ・Guilbertの方法でした。
チャールズGuilbertに脱帽!彼の答えを使用して、私は場合でも、私のページが最初にロード、私の変数にデータを取得することができています。
ここで働いてスクリプトの例です。
jQuery.extend
(
{
getValues: function(url)
{
var result = null;
$.ajax(
{
url: url,
type: 'get',
dataType: 'html',
async: false,
cache: false,
success: function(data)
{
result = data;
}
}
);
return result;
}
}
);
// Option List 1, when "Cats" is selected elsewhere
optList1_Cats += $.getValues("/MyData.aspx?iListNum=1&sVal=cats");
// Option List 1, when "Dogs" is selected elsewhere
optList1_Dogs += $.getValues("/MyData.aspx?iListNum=1&sVal=dogs");
// Option List 2, when "Cats" is selected elsewhere
optList2_Cats += $.getValues("/MyData.aspx?iListNum=2&sVal=cats");
// Option List 2, when "Dogs" is selected elsewhere
optList2_Dogs += $.getValues("/MyData.aspx?iListNum=2&sVal=dogs");
IMOあなたはグローバル変数にこのデータを保存することができます。しかし、いくつかのより多くの固有の名前または使用の名前空間を使用する方がよいでしょう。
MyCompanyの= {};
...
MyCompany.cachedData =データ
そしてまた、それは、これらの目的のためにJSONを使用することをお勧めします、JSON形式のデータは、通常はXML形式で同じデータよりもはるかに小さいます。
私は、サーバーから大規模なXMLファイルを取得するには避けるべきであることをお勧めしたい:変数「XMLは、」のキャッシュのように、とされていないデータストア自体として使用する必要があります。
。ほとんどのシナリオでは、キャッシュを調べて、あなたが望むデータを取得するためにサーバに要求を行う必要があるかどうかを確認することが可能です。これは、あなたのアプリが軽く、より速くなります。
歓声、JRHます。
に.get応答は、デフォルトでキャッシュされます。したがって、あなたが本当に望む結果を得るために何もしないする必要があります。
私は、スレッドが古いです知っているが、私は他の誰かが、これは便利かもしれないと思いました。 jquey.comによると
var bodyContent = $.ajax({
url: "script.php",
global: false,
type: "POST",
data: "name=value",
dataType: "html",
async:false,
success: function(msg){
alert(msg);
}
}).responseText;
直接文字列に結果を得るために役立つだろう。 の.responseText注; の一部
前の回答に似てます:
<script type="text/javascript">
var wait = false;
$(function(){
console.log('Loaded...');
loadPost(5);
});
$(window).scroll(function(){
if($(window).scrollTop() >= $(document).height() - $(window).height()-100){
// Get last item
var last = $('.post_id:last-of-type').val();
loadPost(1,last);
}
});
function loadPost(qty,offset){
if(wait !== true){
wait = true;
var data = {
items:qty,
oset:offset
}
$.ajax({
url:"api.php",
type:"POST",
dataType:"json",
data:data,
success:function(data){
//var d = JSON.parse(data);
console.log(data);
$.each(data.content, function(index, value){
$('#content').append('<input class="post_id" type="hidden" value="'+value.id+'">')
$('#content').append('<h2>'+value.id+'</h2>');
$('#content').append(value.content+'<hr>');
$('#content').append('<h3>'+value.date+'</h3>');
});
wait = false;
}
});
}
}
</script>