2011-09-11 26 views
0

クリックイベントを処理する名前付き関数内のCSSプロパティを変更したい。私が.cssをclickイベントで定義された無名関数で呼び出すと、それは機能します。しかし、私は.cssをハンドラ関数の中で定義された名前付き関数の中で呼びたいと思っています。ここに私のコードです。.css関数がハンドラ関数の内部で機能しない

$(document).ready(function() { 
    $('#popup').click(partial(coolTransition, $(this))); 
}); 

function coolTransition(elem) { 
    shrink(); 

    function shrink() { 
     elem.css('background-color', '#000000'); 
    } 
} 

//used to implement partial function application so that I can pass a handler reference that takes arguments. 
//see http://stackoverflow.com/questions/321113/how-can-i-pre-set-arguments-in-javascript-function-call-partial-function-applic 
function partial(func /*, 0..n args */) { 
    var args = Array.prototype.slice.call(arguments, 1); 
    return function() { 
     var allArguments = args.concat(Array.prototype.slice.call(arguments)); 
     return func.apply(this, allArguments); 
    }; 
} 

ご協力いただきありがとうございます。

+1

「this」は2行目で何を指していると思いますか? –

答えて

2

$(document).ready(function() { 
    $('#popup').click(partial(coolTransition, $(this))); 
}); 

$(this)$(document)です。あなたが$('#popup')のコンテキストに取る$(this)を必要とし、このために、関数が必要です。また

$(document).ready(function() { 
    $('#popup').click((function() { 
     return partial(coolTransition, $(this)); 
    })()); 
}); 

を、あなただけの$(this)完全に回避することができます:

$(document).ready(function() { 
    var $elm = $('#popup'); 
    $elm.click(partial(coolTransition, $elm)); 
}); 

を実際のしかし、この全体の利用状況partialはあまりにも複雑です。なぜあなたはそれが必要だと思いますか?最も簡単なアプローチは次のとおりです。

$(document).ready(function() { 
    $('#popup').click(function() { 
     coolTransition($(this)); 
    }); 
}); 
+0

私はpartialを使って引数を指定して関数を渡しました。私は別のスタックオーバーフローポストでそれを見つけましたが、あなたがやったことははるかにクリーンなので、私はそれを使用するつもりです。ありがとう! – Vish

+0

@Vish:そうだね、別の関数式で関数呼び出しをラップするだけで、それを行うことができます。 :)私はこれを実証するために私の答えを編集しました。 –

2

$(this)は2行目には何と言われていますか?それは$('#popup')ではありません。あなたはそれを参照したい場合は、最初の参照を作成する必要があります。

$(document).ready(function() { 
    var $popup = $('#popup'); 
    $popup.click(partial(coolTransition, $popup)); 
}); 

partialは必要ありません使用して、言いました。

$('#popup').click(function() { 
    coolTransition($(this)); 
}); 

あるいは

$('#popup').click(function() { 
    $(this).css('background-color', '#000000'); 
}); 

そして他の多くの方法があります...ところで

:あなたも行うことができます。 coolTransitionの中にshrinkを定義する必要はないようです。あなたが理由がない限り、それをしないでください。で

関連する問題