2012-03-05 15 views
0

この質問がどれほどシンプルかと思いますが、探している情報が見つかりません。私のページには2つのdivがあり、それらは開いたり閉じたりするjQueryによって制御されます。ページが読み込まれると、デフォルトで両方とも閉じます。私は、ページが読み込まれたり、ポストバックがあったときに、どのようにデフォルト(loginDiv)を開くようにするのだろうかと思いましたか?私はjQueryで非常に初心者であり、これまで私を助けてくれた人は今の選択肢ではありません。前もって感謝します!jQueryでデフォルトのパネルを開く方法

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 

<script type="text/javascript"> 
    // <![CDATA[ 

    (function($) { 
     var containers = ['login', 'account']; 

     var toggle = function(container, flag) { 
      span = $('#' + container + 'Link').find('span'); 
      div = $('#' + container + 'Div'); 

      div[flag ? 'slideDown' : 'slideUp'](); 
      span.html(flag ? '-' : '+'); 
     }; 

     var clickHandler = function() { 
      container = this.id.match(/^[a-z]*/); 
      flag = $(this).find('span').html() == '+'; 
      toggle(container, flag); 

      if (flag) { 
       for (i = 0, j = containers.length; i < j; i++) { 
        con = containers[i]; 


        if (con != container) 
         toggle(con, 0); 
       } 
      } 
     }; 

     $(function() { // on load 

      for (i = 0, j = containers.length; i < j; i++) 
       $('#' + containers[i] + 'Link').click(clickHandler); 

     }); 

    })(jQuery); 

    //]]> 
</script> 

//And here are the divs: 
<div id="loginDiv" style="display:none">...</div> 
<div id="accountDiv" style="display: none;">...</div> 

私は何もなく、誰にも負けないloginDivの表示を変える試みたが、それはまだ正常に動作しない:ここでは

はコードがあります。

答えて

1

あなたはこのような何かを行うことができます。

http://jsfiddle.net/ufomammut66/Em64X/

基本的にページintializesを表示していない要素と。ページがロードされると($function(){ビット)、login要素のcss値'display'がブロックとして設定されます。 bam - ページの読み込み時に目に見える要素があります。

また、一度に1つしか表示されないようにすばやく小さなトグルボタンが表示されました。私はあなたがそこでやろうとしていることを100%確信しているわけではありませんが、1つの要素をすべて見つけようとしているようです。これは、クラス「hideAble」を使って何かをスライドトグルするだけです。そこにはdivまたはdivがあります。

これが役に立ちます。

EDIT:読み込み中にスパンのテキストが変更されました。

+0

閉じる!ありがとうございましたが、唯一の問題は、 "+ログイン"が、そのdiv(既定で開くようにしたいもの)が開いているときに、 " - ログイン"する必要があるページの読み込みを表示することです。これはすべてあなたが質問したので、「ログイン」フォームまたは「アカウント作成」フォームを持つページで、各フォームはjQueryのクリックによって開閉される独自のdivにあります。他の人が開いたら自動的に閉じるようにしていますが、誰かがそのページに移動すると開かれるようにすればよいでしょう。 – Peter

+0

ああ、私は本当に最初のラウンドでこの機能を得ていませんでした。 divの中の子供たちのスパンを反映するためにHTMLを更新してください(少なくとも私はそれらがどこにあるかを想定しています)。この例を更新して、最初のスパンの内容を変更しました。 – ShortRound1911

+0

実際、あなたが以前に持っていたものは、私がそれを手に入れるのを助けました。私はもう少し研究をしなければなりませんでしたが、あなたは正しい方向に私を向けるのを助けました、ありがとう! – Peter

1

<div>タグは意図的に閉じる</div>タグを持っていませんか?これらを閉じて、loginDivからdisplay:noneを削除してください。

+0

通常はコメントする必要がありますが、あまり評判がないので、私はあなたのためにそれを行い、次にこの回答を削除することができます。 –

+0

グッドネス、申し訳ありません!はい、divタグは閉じますが、私はちょうどコードにそれを置くことを忘れました。私は今それを編集します。また、私はすでにあなたの提案を試みましたが、 "+ログイン"は、そのdivが開いているときに " - ログイン"する必要がある場所にとどまります。そのため、jQueryを使用してデフォルトのオープン/クローズを設定する方法があるかどうかは疑問でした。 – Peter

関連する問題