8

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

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

$('#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() 呼び出しはアコーディオンの動作にまったく影響を与えないようです。フォームが有効かどうかに関係なく、次のセクションが表示されます。

私が間違っているかもしれないことは何ですか？

4

4 に答える 4

13

さて、この関数のコーディングを中断し、新鮮な目で戻ってきました。解決策は次のとおりです。

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

アコーディオンの初期化コードに event:false を追加すると、アコーディオン メニューでのマウス クリックでデフォルト アクションが実行されなくなります。その後、カスタム クリック処理コードを記述して、ユーザーがメニューをクリックしたときに validate() 関数を実行し、本質的にアコーディオンのビルドをオーバーライドできます。 -フォームが検証チェックに失敗した場合のクリック機能。

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

ie7,8、chrome 19、ff 3.0.3 で動作

于 2009-11-27T12:29:35.993 に答える
0

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

于 2009-11-25T04:12:13.787 に答える
0

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

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

記録のために: 「JQuery のアコーディオン モジュール」のようなものは (少なくともまだ) ありません。JQuery 用のアコーディオン プラグインはいくつかあります。

于 2009-11-25T04:17:02.653 に答える
0

以下のコードを ready 関数の最後に一緒に書く必要があります:

$('#accordion h3').unbind('click');
$('#accordion a').unbind('click');
于 2010-06-28T13:05:59.490 に答える