jQuery API の jQuery . proxy( function, context ) は、functionに指定した関数内のコンテキスト（this）を、contextに指定したコンテキスト（this）に、強制的に設定するメソッド。
引数
- function
変更したいコンテキスト（this）を持つ関数。
- context
functionに指定した関数内のコンテキスト（this）を指定。
戻り値
- Function
関数。
記述方法
jQuery . proxy( 関数, コンテキスト );
「関数」に指定した関数数内のコンテキスト（this）を、「コンテキスト」に指定したコンテキスト（this）に設定。
記述例
function sample() {
jQuery( '#sample-name' ) . text( this . name );
jQuery( '#sample-score' ) . text( this . score );
}
var Tarou = {
name: '太郎',
score: '95'
}
jQuery( function() {
jQuery( '#jquery-sample button' ) . click(
jQuery . proxy( sample, Tarou )
);
} );
jQuery( '#sample-name' ) . text( this . name );
jQuery( '#sample-score' ) . text( this . score );
}
var Tarou = {
name: '太郎',
score: '95'
}
jQuery( function() {
jQuery( '#jquery-sample button' ) . click(
jQuery . proxy( sample, Tarou )
);
} );
idが「sample-name」の要素に「太郎」、idが「sample-score」の要素に「95」と表示する。
実装例（サンプル）
名前：
数学：
科学：
実装例（サンプル）の動作について
- 「大翔」ボタンをクリックすると、「名前：大翔」「数学：80」「科学：95」と表示する。
- 「さくら」ボタンをクリックすると、「名前：さくら」「数学：95」「科学：80」と表示する。
- 「結衣」ボタンをクリックすると、「名前：結衣」「数学：75」「科学：100」と表示する。
実装例（サンプル）のソースコード
JavaScript
<script type="text/javascript">
<!--
function sample() {
jQuery( '#jquery-sample-name' ) . text( this . name );
jQuery( '#jquery-sample-mathematics' ) . text( this . mathematics );
jQuery( '#jquery-sample-science' ) . text( this . science );
}
var Hiroto = {
name: '大翔',
mathematics: '80',
science: '95'
}
var Sakura = {
name: 'さくら',
mathematics: '95',
science: '80'
}
var Yui = {
name: '結衣',
mathematics: '75',
science: '100'
}
jQuery( function() {
jQuery( '#jquery-sample-Hiroto' )
. click(
jQuery . proxy( sample, Hiroto )
);
jQuery( '#jquery-sample-Sakura' )
. click(
jQuery . proxy( sample, Sakura )
);
jQuery( '#jquery-sample-Yui' )
. click(
jQuery . proxy( sample, Yui )
);
} );
// -->
</script>
<!--
function sample() {
jQuery( '#jquery-sample-name' ) . text( this . name );
jQuery( '#jquery-sample-mathematics' ) . text( this . mathematics );
jQuery( '#jquery-sample-science' ) . text( this . science );
}
var Hiroto = {
name: '大翔',
mathematics: '80',
science: '95'
}
var Sakura = {
name: 'さくら',
mathematics: '95',
science: '80'
}
var Yui = {
name: '結衣',
mathematics: '75',
science: '100'
}
jQuery( function() {
jQuery( '#jquery-sample-Hiroto' )
. click(
jQuery . proxy( sample, Hiroto )
);
jQuery( '#jquery-sample-Sakura' )
. click(
jQuery . proxy( sample, Sakura )
);
jQuery( '#jquery-sample-Yui' )
. click(
jQuery . proxy( sample, Yui )
);
} );
// -->
</script>
CSS
<style>
<!--
#jquery-sample {
margin: 10px;
}
-->
</style>
<!--
#jquery-sample {
margin: 10px;
}
-->
</style>
HTML
<div id="jquery-sample">
<p>
<button id="jquery-sample-Hiroto">大翔</button>
<button id="jquery-sample-Sakura">さくら</button>
<button id="jquery-sample-Yui">結衣</button>
</p>
<p>名前：<span id="jquery-sample-name"></span></p>
<p>数学：<span id="jquery-sample-mathematics"></span></p>
<p>科学：<span id="jquery-sample-science"></span></p>
</div>
<p>
<button id="jquery-sample-Hiroto">大翔</button>
<button id="jquery-sample-Sakura">さくら</button>
<button id="jquery-sample-Yui">結衣</button>
</p>
<p>名前：<span id="jquery-sample-name"></span></p>
<p>数学：<span id="jquery-sample-mathematics"></span></p>
<p>科学：<span id="jquery-sample-science"></span></p>
</div>