jquery - トグルが失敗するのはなぜですか

Question

私はこれを数え切れないほど繰り返してきました。

jquery ライブラリの使用。

私がやろうとしているのは、リンクを介してdivを切り替えることだけです。

<a href="" id="mGoldNav">Click Me</a>

これは私のjqueryコードです

$('#mGoldNav').click(function(){
    $('#module-golden-nav').toggle("slow");
});

私のサイトでは、基本的に何も起こりません。私は alert() を配置し、それが発火するので、click() は機能します。しかし、トグルは失敗します。

しかし、http://jsfiddle.net/BaQd2/1/では、一度は動作するが消えてしまい、もう一度実行すると奇妙なエラーが表示されることに気付くでしょう: {"error": "POST request を使用してください" }

なぜそれが私を台無しにしているのですか？

ありがとう！

score 1 · Accepted Answer

hrefのように、リンクの属性に何かを入れることもできます#。 http://jsfiddle.net/BaQd2/2/

score 1 · Accepted Answer

クリックコールバックの最後に戻りfalse、クリックされたアンカーをたどるブラウザーのデフォルトの動作を防ぎます。

これはうまくいくはずです：

$('#mGoldNav').click(function(){
    $('#module-golden-nav').toggle("slow");
    return false;
});

score 1 · Accepted Answer

a要素をボタンとして使用するのは実際には悪い考えです。しかし、あなたの定義href属性では、望ましくないアクション、ポストバックを行います。#（または）のように変更すると、必要なjavascript:void(0)ものが得られます。

<a href="#" ..

score 1 · Accepted Answer

これはアンカータグであるため、デフォルトのポストバックアクションをトリガーします。トグルを使用するには、使用する必要があります。

return false;

このような：

$('#mGoldNav').click(function(){
     $('#module-golden-nav').toggle("slow");
     return false;
});

score 0 · Accepted Answer

代わりにこれを試してください：

$('#mGoldNav').click(function(e){
    e.preventDefault();
    $('#module-golden-nav').toggle("slow");
});

5 に答える 5