2009-06-23 20 views
0

私の仕事は、メインナビゲーションからのリンクをクリックするとdivを表示して非表示にすることです。これにより、メインナビゲーションの別の部分をクリックするとdivが非表示になります。誰もが見ることができる場合は私は特定のリンクをクリックしていくつかのdivを表示しようとしています

<script type="text/javascript"> 
$(document).ready(function(){ 
     $("#tagcloud").hide(); 
      blogLink = $("ul.mainnav li.blog a").click(function() {  
      $("#tagcloud").show();});$("ul.mainnav li a").not  (blogLink).click(function() {  
      $("#tagcloud").hide();});  

      }); 
</script> 

....

おかげでみんなespecially..Matchuに行く....

コードは以下のようになりましたし、作品をDONE

これに関する問題があれば、www.alwaystwisted.com/index.htmlでご連絡ください。

また、JQuery 1.3本....うまくいけば

STYビットまたは多くの良い....

に関して、それのまわりで私の頭を取得

+0

、そこに私の答えのコードを試してみてください:) – Matchu

+0

^_^ – Matchu

答えて

1

最新のアップロードのための三回目を更新しました!あなたがクラスにtagcloudを切り替える前に、あなたが私を与えたページで遊んで

は、ここでは、私はFirebugのコンソールで作業を行うことができるものです:

blogLink = $("ul.mainnav li.blog a").click(function() { 
    $("#tagcloud").show(); 
}); 
$("ul.mainnav li a").not(blogLink).click(function() { 
    $("#tagcloud").hide(); 
}); 

はその1を試してみてください:)

そして、「あなたが実際にやろうとしていたことを見る前に、それはIDではないクラスを使用する」ということについて。 のIDを使用する必要があります。インスタンスが1つだけの場合は混乱してしまいます。

+0

サイドノートを助けるために喜ん:ユニークなIDの問題はクラスではなく、IDを用いて固定することができますがタグクラウドのこれは、あなたが持っている主な問題を解決することはできません。 – Travis

+0

アハハッハ!私は#tagcloudが1つあったと仮定していましたが、彼は冗長になっていました。そのコードで#tagcloudを.tagcloudに置き換えることは、それがもっと私にとって意味があることを意味します。はい、クラスを使用します:) – Matchu

0

私はここでもあなたの目標を理解しているとは思えませんが、いくつかのHTMLも見ることなく、最初に確認できることがいくつかあります。

  • $( 'ul.mainnav)...あなたがアップ
  • $(この).next( "#のtagcloud")、その文字列を閉じる必要があり...あなたは、単に$( "#のtagcloudを使用することができます")ページ上で一意のIDを持つ必要があるからです。

人を助けるコードをいくつか投稿してください。

0

このスレッドで既に説明した構文エラー以外にも、おそらくfalseを返す必要があります。これらのリンククリックでは、あなたの行動が起こり、リンクはどこにでも向かいます。

もちろん、これはアクセシビリティの議論の扉を開きます。私はすぐに、その側面について心配する前に作業デモを得るだろう。

0

のハンドブックclickul.mainnavにバブリングし、そのclickハンドラも実行します。

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('li.blogcontent').click(function(e) { 
     e.stopPropagation(); // Stop the bubbling up to its parent 
     $("#tagcloud").show(); 
    }); 
    $('ul.mainnav').click(function() { 
     $("#tagcloud").hide(); 
    });        
}); 
</script> 

やイベントの委任を使用して(私がテストしていませんが、近くにあるべきである)バブリング:

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('ul.mainnav').click(function(e) { 
     var target = $(e.target); 
     if(target.hasClass('blogcontent')){ 
      $("#tagcloud").show(); 
     } 
     else{ 
      $("#tagcloud").hide(); 
     } 
    });        
}); 
</script> 
0

ULコンテナにli要素からバブルアップイベントは、おそらく問題です。私はjQueryに少し慣れていませんが、DOMイベントを変更せずに直接渡している場合(jQueryの作成者は既存のオブジェクトを変更するのではないので疑問です)、preventDefault()をそのまま使用することをお勧めしますすべてブラウザではサポートされていません。事象を止め、バブリングを防止するためのツールベルトにメソッドを持たなければなりません。

あなたが私を与えたページで遊ん
function stopEvent(event){ 
    event.preventDefault(); 
    event.stopPropagation(); 
    event.stopped = true; 
} 
関連する問題