1

JSON 呼び出しから取得した値を使用して、多数の画像にタイトルを動的に追加しようとしています。

これは私がこれまでに持っているものです

$(".watch_view img").each(function() {
$.ajax({
    url: 'http://gdata.youtube.com/feeds/api/videos/T2aMBeeM4yw?v=2&alt=jsonc',
    dataType: 'json',
    success: function(json) {   
    song_title = json.data.title;// song title is retrieved without issue                           
    }   
    });

   alert(song_title); //this to be removed
   //the title attr below is only added when the above alert is in place    
   $(this).attr('title', song_title);
   $(this).attr('alt', "This works everytime"); 
   });

上記は機能しますが、不要なアラートを追加してプロセスを「停止」した場合のみです。JSON 呼び出し (?) からデータを取得する前にコードが実行されていると推測でき、アラートによって追いつくことができます。 .

JSON呼び出しの後に実行する別の関数、またはコードが「成功」関数に入る必要があると思いますが、その場合に「this」要素を保持する方法がわかりません。

ヘルプとアドバイスをいただければ幸いです。

ありがとう

クリス

4

4 に答える 4

1

AJAX は Asynchronous JavaScript の略であることに注意してください。これは、サーバーとの通信中にブラウザが応答しなくなることを意味します。

関数を呼び出す$.ajax(...)と、スクリプトは応答を待たずにその後も続行します (待機するように構成できますが、同期呼び出しになります)。

サーバーが成功して戻ってきたら、そのイベントに応答する必要があります。したがって、応答処理コードはsuccess関数本体にある必要があります。

$(".watch_view img").each(function (index,element) {
    $.ajax({
        url: 'http://gdata.youtube.com/feeds/api/videos/T2aMBeeM4yw?v=2&alt=jsonc',
        dataType: 'json',
        success: function (json) {
            song_title = json.data.title; // song title is retrieved without issue                           
            $(element).attr('title', song_title);
            $(element).attr('alt', "This works everytime");
        }
    });

});

古いコードでは、サーバーが戻る前にアラートに達していました。ブレークポイントを配置すると、人間の時間を処理している間にサーバーが応答を返すのに十分な時間があったため、機能しました:)

アップデート

thisさらに、コールバック内では返されたデータが参照され、(反復された要素になる)successの期待値がオーバーライドされることを知っておく必要があります。呼び出しのパラメーターを実際に宣言する必要があるため、成功呼び出し内でそれらを参照できます。thiseacheach

于 2012-10-16T18:29:34.410 に答える
0 
$(".watch_view img").each(function() {
$.ajax({
    url: 'http://gdata.youtube.com/feeds/api/videos/T2aMBeeM4yw?v=2&alt=jsonc',
    dataType: 'json',
    success: function(json) {   
        song_title = json.data.title;// song title is retrieved without issue 

       $(this).attr('title', song_title);
       $(this).attr('alt', "This works everytime");                           
    }   
    });
});

成功のコールバックを適切に使用する必要があります。それが役立つことを願っています。

コールバックは非同期 JavaScript に使用されます。それ以外の場合は、競合状態 (表示されていたもの) が発生します。

于 2012-10-16T18:30:39.923 に答える
0

ajax 呼び出しは非同期です。つまり、タイトルを設定しても、サーバーはまだリクエストを処理しています。不要なアラートを配置すると、クライアントをしばらく停止すると、サーバーがリクエストに応答します。これが機能する理由です。

上記のように、コードを成功に入れると、期待どおりに動作します。

于 2012-10-16T18:34:47.177 に答える
0

あなたはこれを試すことができます

var _song_title = ''
$(".watch_view img").each(function() {    
$.ajax({
    url: 'http://gdata.youtube.com/feeds/api/videos/T2aMBeeM4yw?v=2&alt=jsonc',
    dataType: 'json',
    success: function(json) {   
    _song_title = json.data.title;// song title is retrieved without issue                           
    }   
    }).done(function(){
        alert(_song_title); //this to be removed
   //the title attr below is only added when the above alert is in place    
   $(this).attr('title', _song_title);
   $(this).attr('alt', "This works everytime");
    });
于 2012-10-16T18:46:26.037 に答える