2

我正在处理的一些代码有问题。我有一个通用函数 ( ajaxContent),它可以从多个方面使用。我需要的是在进行 AJAX 调用之后运行一个函数,但是我需要传递一些我在调用之前拥有的数据(所以不是从 AJAX 调用返回的数据。

function ajaxContent(url, id, target, data, callbackFunction) {

  $.ajax({
    async : true,
    ....    
    complete: function(){
      if(typeof callbackFunction == "function"){
        callbackFunction(); // function get's executed here, lead_id is not available
      }
    }
  });
}    

$(document).on("click", "#something", function(){
  var leaf_id = $(this).attr('rel');

  ajaxContent(url, id, target, data, function(leaf_id){

    url = "/path/" + leaf_id;
    window.location = url;

  })
})

$(document).on("click", "#action", function() {

    ajaxContent(url, id, target, data, function(){

        if ($(this).attr('rel') == "M_0") // $(this).attr('rel') not available here, so need to pass through some way
            $('#treedata').css('background', 'url(/img/rotonde.png) 50% 50% no-repeat');
  });

});    

我也许可以使用类似的东西

function ajaxContent(url, id, target, data, callbackFunction, varA, varB, varC, varD) { 
   callbackFunction(varA, varB, varC, varD);
} 

ajaxContent(url, id, target, data, function(varA){
}, varA, varB, varC, varD)` 

但不是真正可扩展的。

我希望这很清楚:-)

4

2 回答 2

1

leaf_id未定义,因为您在调用callbackFunction();.

您可以通过回调传递变量,但您需要一直传递它,这是您如何编写代码以使其leaf_id传递的方法:

function ajaxContent(url, id, target, data, callbackFunction, leaf_id) {
    $.ajax({
        async : true,
    ....        
        complete: function(){
          if(typeof callbackFunction == "function"){
            callbackFunction(leaf_id);
          }
        }
    });
}

ajaxContent(url, id, target, data, function(leaf_id){
    url = "/path/" + leaf_id;
    window.location = url;
}, $(this).attr('rel'));

http://jsfiddle.net/qaWNp/2/

于 2012-08-20T20:44:38.710 回答
1

在您现在答案中的代码中,是处理程序函数leaf_id内的局部变量。document.ready()因此,它在该上下文之外不可用。

你有几个选择来解决这个问题:

  1. 您可以在处理函数中移动 ajaxContent 函数的定义,document.ready()以便它能够看到 leaf_id。

  2. 您可以创建leaf_id一个全局变量,以便可以从任何地方访问它。

  3. 您可以将leaf_idajaxContent 作为函数参数传递给。

如果没有更多关于您正在做什么的上下文,并且因为这是一个仅与特定操作相关的瞬态值,我认为最好的选择是#3:

function ajaxContent(url, id, target, data, leafID, callbackFunction) {

    $.ajax({
        async : true,
    ....        
        complete: function(){
          if(typeof callbackFunction == "function"){
            // you can access any of the ajaxContent function arguments here
            callbackFunction(leafID);
          }
        }
    });
}       

$(document).on("click", "#something", function(){
  var leaf_id = $(this).attr('rel');

  ajaxContent(url, id, target, data, leaf_id, function(leafID){

    url = "/path/" + leafID;
    window.location = url;

  })
})

或者,如果您有很多变量要传递,您可以创建一个空对象,然后将每个变量作为该对象的属性,然后将单个对象传递给 ajaxContent 和回调,如下所示:

function ajaxContent(url, id, target, data, settings, callbackFunction) {

    $.ajax({
        async : true,
    ....        
        complete: function(){
          if(typeof callbackFunction == "function"){
            // you can access any of the ajaxContent function arguments here
            callbackFunction(settings);
          }
        }
    });
}       

$(document).on("click", "#something", function(){
  var args = {};
  args.leafID = $(this).attr('rel');

  ajaxContent(url, id, target, data, args, function(settings){

    // access args.leafID here
    url = "/path/" + leafID;
    window.location = url;

  })
})

请注意,在我的代码示例中,我将参数命名为与其他变量不同的名称,以避免混淆哪个是哪个。

于 2012-08-20T20:57:25.077 回答