0

こんにちは私はAJAX結果のキャッシュメカニズムを備えた以下のコードを持っています：

jQuery( document ).ready( function( $ ) {
var _doing_ajaxx = false;
$('.toolbar').remove();
$('#mydiv #frontend').click(function() {    
if (_doing_ajaxx) {
    return false;
}

var title_shortcode = $(this).text();


var insert_namex=  $(this).attr('class');


var titlejsselector=title_shortcode.replace(/ /g,'');


var buttonval=$('#'+titlejsselector+' input').val();

if (buttonval=='Minimize')  {
//stop ajax request if button is set

    $('#'+titlejsselector+' div').remove();
    $('#'+titlejsselector+' input').remove();

} else {
//initialize ajax variables
var cacheObj = {};
var data = {
        action: 'test_ajax_response',
        test_ajax_response_nonce: the_ajax_script.test_ajax_response_nonce, 
        postID_from_ajax : the_ajax_script.postid_to_ajax,
        insert_name_ajax: insert_namex,
        title_ajax: title_shortcode
    }; 
if (cacheObj.postID_from_ajax){

display(cacheObj.postID);

}else{

  // Do your ajax call
$.post(the_ajax_script.ajaxurl, data, function(response) {

    _doing_ajaxx = false;
    cacheObj.postID_from_ajax = response;
    display(response);

});

 }

 function display(response){

  $('#mydiv #frontend').next().slideToggle();   
  $('#mydiv #'+titlejsselector).append(response+"<input type='hidden' id='minimizebutton' value='Minimize'>");
  SyntaxHighlighter.highlight();

  $('.toolbar').remove();

  }   

}); 


});

ただし、Firebugで確認したところ、キャッシュされた結果を使用する代わりに、サーバーにリクエストを送信しています。

上記のコードはこのように機能します。ユーザーは最初にリンクをクリックしてから、（AJAX応答からの）結果をサーバーに表示します。ユーザーは、リンクをもう一度クリックすることで結果を最小限に抑えることができます。これは2回目のクリックです。最小化ボタンは結果を削除します。ユーザーがリンクをもう一度クリックして結果を再度表示する場合、サーバーに再度リクエストするのではなく、最初のクリックからキャッシュされた結果を使用します。

上記のコードで何を変更する必要がありますか？ヒントをありがとう。

更新：ユーザーが結果を最小化すると、2回目のクリックでキャッシュ変数cacheObj.postID_from_ajaxが破棄される（または空になる）ことにも気づきました。したがって、3回目のクリックでは、このキャッシュ変数はnullであるため、使用できなくなります。

4

2 に答える 2

2

cacheObj毎回クリックハンドラー内に空を作成しています。次に、それを作成した後、空のオブジェクトとして宣言したため、存在しないプロパティを探しています

var cacheObj = {};

if (cacheObj.postID_from_ajax)/* object has no properties...will always be false*/

var cacheObj = {};クリック ハンドラの外で宣言する必要があります。

于 2013-01-04T03:21:12.327 に答える
0

はcacheObjクリック ハンドラーに対してローカルです。ここcacheObjでは、同じ共有コンテキスト (クロージャー) にあるため、すべてのクリック ハンドラーで同じものを使用できます。

これを試して

jQuery(document).ready(function($) {
    // initialize ajax variables
    var _doing_ajaxx = false;
    //cache object is created in the covering closure since it must be available across all click handlers
    var cacheObj = {};

    $('.toolbar').remove();
    $('#mydiv #frontend').click(function() {
        if (_doing_ajaxx) {
            return false;
        }

        var title_shortcode = $(this).text();

        var insert_namex = $(this).attr('class');

        var titlejsselector = title_shortcode.replace(/ /g, '');

        var buttonval = $('#' + titlejsselector + ' input').val();

        if (buttonval == 'Minimize') {
            // stop ajax request if button is set

            $('#' + titlejsselector + ' div').remove();
            $('#' + titlejsselector + ' input').remove();

        } else {
            var data = {
                action : 'test_ajax_response',
                test_ajax_response_nonce : the_ajax_script.test_ajax_response_nonce,
                postID_from_ajax : the_ajax_script.postid_to_ajax,
                insert_name_ajax : insert_namex,
                title_ajax : title_shortcode
            };
            if (cacheObj.postID_from_ajax) {

                display(cacheObj.postID);

            } else {

                // Do your ajax call
                $.post(the_ajax_script.ajaxurl, data, function(response) {

                            _doing_ajaxx = false;
                            cacheObj.postID_from_ajax = response;
                            display(response);

                        });

            }

            function display(response) {

                $('#mydiv #frontend').next().slideToggle();
                $('#mydiv #' + titlejsselector)
                        .append(response
                                + "<input type='hidden' id='minimizebutton' value='Minimize'>");
                SyntaxHighlighter.highlight();

                $('.toolbar').remove();

            }
        }
    });

});
于 2013-01-04T03:26:26.667 に答える