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 响应）显示给服务器。用户可以通过再次单击链接来最小化结果。这是第二次点击。最小化按钮将删除结果。如果用户再次单击该链接以再次查看结果，我不想再次向服务器请求，而是使用第一次单击的缓存结果。

上面的代码需要改什么？感谢您的任何提示。

更新：当用户最小化结果时，我还注意到缓存变量 cacheObj.postID_from_ajax 在第二次单击时被破坏（或变为空）。所以在第三次点击时，这个缓存变量不能再使用了，因为它是空的。

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 回答