2009-08-12 5 views
4

これを行うより良い方法がわかっている場合は、教えてください。 私は多くのボタン、図表を含むページを持っています。 私はイベントの伝播を止めることについて読みましたが、それは私が使用するものです。 cerain要素のヘルプを有効にしたい私はヘルプが有効なdivにカーソルを変更するチェックボックスを持っています。私がしたいのは、通常のクリック動作の前にヘルプ機能を追加することです。Jquery prependクリックハンドラ

基本的にはこのようです。私が欲しいもの

<input type="button" value="Click me" onclick="alert ('hello')" /> 

はチェックボックスがクリックされた場合、私は(すでに完了)CSSクラスを追加し、私は通常、クリックする前にクリックハンドラを追加することです。要素がクリックされると、ヘルプ機能が実行され、デフォルトのボタンクリックハンドラは起動されません。ヘルプチェックボックスがオフの場合、ヘルプ機能を削除します。 私は各要素に対してこれをハードコアすることができ、チェックボックスがオンになっているかどうかを確認するためにヘルパ関数をチェックします。しかし、私はそれをやるより一般的な方法を好むだろう。

おかげ

私はあなたがバインドで遊んでたいと思うジョン

答えて

8
 $(":button").each(function() { 

      // your button 
      var btn = $(this); 

      // original click handler 
      var clickhandler = btn.attr("onclick"); 
      btn.attr("onclick", "return false;"); 

      // new click handler 
      btn.click(function() { 

       if ($("#chkbox").attr("checked") == true) { 

        // TODO: show your help 
        // TODO: catch event 

       } 
       else { 

        clickhandler(); 

       } 
      }); 
     }); 
+0

素晴らしい、正確に私が必要なものありがとう – John

+0

私の既存のコードを簡素化してくれてありがとう。 – IEnumerator

0

は/この場合にはバインド解除 - チェックボックスを選択するとき、あなたのボタンの新しいクリックイベントをバインドすることができhttp://docs.jquery.com/Events/unbind#typefn

を参照してください - と後でそれらをバインド解除します。

あなたはそれが

あなたはの同類何かを使用したくない場合は、おそらくまた、デフォルトのクリック動作を抑制するためにEvent.preventDefault(http://docs.jquery.com/Events/jQuery.Event)で動作する必要があります:

$("a").bind("click", function(event){ 
if ($("#helpcheckbox").attr('checked') 
{ 
    event.preventDefault(); 
    // do something 
} 
}); 

より多くのコードがなければ、それはより正確です。

関連する問題