2

かなり基本的な機能を提供し、デフォルトのjQuery選択メソッドを使用する小さなコードをいくつか作成しました。これは次のように機能します。リンクをラップする2つのliがあります。リンクがクリックされると、liに特定のcssクラスがある場合、jQueryはチェックします。そうでない場合は、必要なアクションを実行します。

率直に言って、最初のliにこのクラスがない場合ではなく、2番目のliにこのクラスがない場合にのみ機能します。

なぜこれが起こるのか、そしてそれをどのように解決できるのか誰かに教えてもらえますか？

jsfilldeはここにあり、物事をより明確にします：http: //jsfiddle.net/EDa7n/

4

2 に答える 2

3

アクティブではないアンカータグにのみクリック機能をバインドしています。

それらすべてにバインドする必要があり、クリック機能内で、クラスがアクティブかどうかを確認します。

http://jsfiddle.net/jimschubert/EDa7n/1/

$(".ui-tabs-nav li a").click(function(){ //Weird, it works only for the second li, not for the first (eg when the second is active)
    $('#BT-tabVerbetering, #BT-tabWens').show();
    if(!$(this).hasClass("ui-state-active")) 
        $('#BT-nieuw').hide();
});
于 2012-10-16T21:51:59.443 に答える
2

イベントは、イベント バインディング メソッドが呼び出された時点で要素にバインドされます。要素のクラスを変更しても、要素にバインドされているイベントは変更されません。たとえば、このクリック イベント:

$("#BT-menu li:not(.ui-state-active) a").click(function(){...

これによりli:not(.ui-state-active) a、イベントが最初のタブではなく 2 番目のタブにバインドされます。最初のタブにはこのイベントがバインドされず、2 番目のタブには常にイベントがバインドされます。代わりに、イベントを両方の要素にバインドする必要があります

$("#BT-menu li a").click(function(){...

次に、イベント内でアクティブかどうかを検出します。

無関係ですが、単にjsfiddleにリンクするのではなく、関連するコードとマークアップを質問に投稿する必要があります. フィドルは質問への良い追加ですが、実際にコードを投稿する代わりにはなりません。

于 2012-10-16T21:50:45.733 に答える