初心者Javascriptを：jQueryの「トグル」問題

HIすべて、初心者Javascriptを：jQueryの「トグル」問題

私は真のJSの初心者ですので、私は私が欲しい効果を与えるのを助けるためにjQueryのいくつかの簡単なビットを使用してきました。 jQueryのトグル効果を実装しようとするまでは、すべてうまくいっています。コードを複数の要素に適用したいので、各トグルタブの行を記述するのではなく、それをスリム化して汎用的にしようとしています。

私はちょうどそれを動作させるように見えることができません！

ヘッド/ javascriptのワット：

<head> 
<title>My Title</title> 
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css" /> 
<link rel="stylesheet" type="text/css" href="style.css" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $('#content div[id^=toggle]').hide(); 
    $('[class^=info]').click(function() { 
     var x = $(this).attr("idName"); 
     $('#toggle_' + x).toggle(); 
     return false; 
     }); 
    }); 
</script> 

</head>

ボディ：

<div id="content"> 
    <div class="info_tab" id="info_grover"> 
     <img src="images/pgrover_120x137.jpg" alt="Philip Grover" /> 
     <h1>Philip Grover</h1><br /> 
     <p>Info about Philip Grover</p> 
    </div> 
    <div id="toggle_info_grover"> 
    </div> 
    <div class="info_tab" id="info_lewis"> 
     <img src="images/rlewis_120x137.jpg" alt="Roy Lewis" /> 
     <h1>Roy Lewis</h1><br /> 
     <p>Info about Roy Lewis</p> 
    </div> 
    <div id="toggle_info_lewis"> 
    </div> 
</div>

私の答えは、おそらく非常に簡単です知っていると私はそれが、「この私の使用方法とは何かを持っている疑いがあります"キーワードを使用しても検索の1時間後には、私の特定のシナリオではうまくいかないようです。私は本当にアドバイスを感謝します。事前に

おかげで、

リッチ

出典

2011-02-09 RichieAHB

あなたのコードは、「idName」という属性を探している、まだあなたのHTML要素のどれもがその属性を持っていません。私はあなたがちょうど "id"を望むと思う。

var x = $(this).attr("id");

または、より簡単に、

var x = this.id;

出典

2011-02-09 14:47:58 Pointy

私は1分以内に答えを得るだろうと思う。私が言うように、初心者の合計エラーですが、ありがとう！リッチ – RichieAHB

@リチャード・ベディングトンもしあなたが良い、明確に言い方をされた質問をするなら、あなたはここですばやく答えを得るでしょう。文字通り世界中の何十人もの人々が熱心に新しい飼料を待っています:-) – Pointy

ハードな質問をするまで待ちます:-) –

これは仕方によって、複雑です。あなたの「トグラー」は次の要素が常にある場合は、より良いクリック可能な要素の「トグラー」のようなクラスを使用すると思います（何もない、何のIDなし、何もない）と使用：私は本当になかった

$('.toggler').click(function() { 
$(this).prev().toggle(); 
});

出典

2011-02-09 14:52:02 Capsule

ありがとう私は実際に.prev（）の代わりに.next（）を使用していますが、アイデアは変わりません。 – RichieAHB

初心者Javascriptを：jQueryの「トグル」問題

答えて

関連する問題