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内のローカル変数です。document.ready()そのため、そのコンテキスト以外では使用できません。

それを修正するには、いくつかの選択肢があります。

  1. document.ready()leaf_idを参照できるように、ajaxContent 関数の定義をハンドラー関数内に移動できます。

  2. leaf_idどこからでもアクセスできるように、グローバル変数を作成できます。

  3. leaf_id関数の引数として ajaxContent に渡すことができます。

あなたがしていることについてこれ以上のコンテキストがなければ、これは特定のアクションにのみ関連付けられた一時的な値であるため、最良のオプションは #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 に答える
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 に答える