JQueryアコーディオン - クリックイベントのバインド解除

Question

JQueryのaccordion moduleを使用してフォームウィザードを作成しています。問題は、アコーディオンメニューのマウスクリックをオーバーライドして、アコーディオンが次のセクションを表示する前にフォームが最初に検証されるようにすることです。

私は次のことを試してみました：

$('#accordion h3').unbind(); 

$('#accordion h3').click(function() { 
    if (validate()) 
    { 
    $("#accordion").accordion('activate', 2); 
    }else 
    { 
    alert("invalid form"); 
    } 
} 

しかし、上記のコードは動作しません。アコーディオンの組み込みのクリックイベントが呼び出され、フォームが有効かどうかにかかわらず、アコーディオンは次のセクションを表示します。

$('#accordion h3').click(function(event) { 
    if (validate()) 
    { 
    $("#accordion").accordion('activate', 2); 
    }else 
    { 
    alert("invalid form"); 
    }   
    event.stopPropagation(); 
}); 

しかしのstopPropagation（）呼び出しは全くアコーディオンの動作に影響を与えるとは思われない、次のセクションでは、フォームが有効であるか否かが表示されます。

は、私はまた、次のコードを試してみました。

私が間違っている可能性がありますか？

ありがとうございます！

Answer 1

さて、この機能をコーディングしてから休憩し、新しい目でそれに戻ってきました。

$("#accordion").accordion({event: false}); 

追加イベント：デフォルトのアクションを実行してから、アコーディオンメニューのマウスクリックを防ぐことができますアコーディオンintitializationコードに誤ったし、私は、カスタム書くときのvalidate（）関数を実行するコードを扱うクリックすることができます。ここソリューションですユーザーがメニューをクリックすると、フォームが妥当性チェックに失敗した場合、アコーディオンのビルトインクリック機能が本質的にオーバーライドされます。

ところで、ここではJQuery UIのアコーディオンモジュールを使用しています。

ie7,8と連携し、クロム19、3.0.3

Answer 2

event.stopPropogation()イベントターゲットに登録されているイベントハンドラが呼び出されなくなることはありません。event.bubblesがtrueの場合、イベントを停止してDOMをバブリングしません。イベントハンドラにfalseを返すか、event.preventDefault()を呼び出すか、詳細についてはhereまたはhereを参照してください。

Answer 3

ソースコードから判断すると、イベントはh3のものではなく周囲のコンテナにバインドされています（プラグインはイベント委任を使用します）。さらに、ハンドラはclickにバインドされていませんが、click.ui-accordionにバインドされています。だから、試してみてください。

$('#accordion').unbind('click.ui-accordion'); 

そして、ちょうどレコードの（少なくともまだ）「jQueryのアコーディオンモジュール」のようなものはありません。 JQuery用のプラグインはいくつかあります。

Answer 4

ffをあなたはレディ機能の下で一緒に以下のコードを記述する必要があります。

$('#accordion h3').unbind('click'); 
$('#accordion a').unbind('click');