2016-12-05 8 views
0

変数をjQuery関数に渡す方法を解明しようとしていますが、この(非常に単純化された)例が意図したとおりに動作しない理由はありません。アイデアは、チェックボックスをクリックするとアラートが表示されるということです。変数を渡すときにjQuery関数がロード時に実行される

ここで問題ありません:関数へのアラートテキストを渡すときに

<input type="checkbox" class="check"/> 

<script> 

    do_alert = function() { 
    alert("Welcome"); 
    } 

    $('.check').change(do_alert); 

</script> 

しかし、アラートが正しいメッセージテキストで、とすぐにページが読み込まとして示されている:

<input type="checkbox" class="check"/> 

<script> 

    do_alert = function(message) { 
    alert(message); 
    } 

    $('.check').change(do_alert("Welcome")); 

</script> 

このように:

<input type="checkbox" class="check"/> 

<script> 

    function do_alert(message) { 
    alert(message); 
    } 

    $('.check').change(do_alert("Welcome")); 

</script> 

いずれの場合も、チェックボックスをオンにしても機能は実行されませんが、オンですページを読み込む。私はここで何が欠けていますか?

+1

'change'は関数を引数として期待していますが、' do_alert( "Welcome") 'を使って関数を呼び出し、' undefined'の結果だけを渡しています – haim770

答えて

2

あなたはchangeイベントハンドラにdo_alert関数への参照を渡しているので、$('.check').change(do_alert);作品があり、かつ必要なときにそのイベントハンドラがdo_alert()を実行する理由。 $('.check').change(do_alert("Welcome"));が機能しない理由は、その場合に参照として渡すのではなく、do_alert関数を実行しているためです。パラメータを渡すためには、あなたはそうのように、無名関数であなたの関数呼び出しをラップする必要があります:

$('.check').change(function(){ 
    do_alert("Welcome"); 
}); 

あなたは匿名関数(function() { ... })を作成しているが、あなたはそれを実行していないことがあり何が起こります(関数定義の後に括弧がないため)。だから、イベントハンドラが期待している無名関数への参照を渡しています。

2

この方法で試してください。

$(document).ready(function() { 
 
    
 
    do_alert = function(param) { 
 
    alert(param); 
 
    } 
 
    $('.check').change(function() { 
 
     do_alert("Welcome"); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" class="check"/>

関連する問題