0

誰かがリンクをクリックしたときに DIV のコンテンツをロードするために、このコードを書きました。

リンクを 2 回クリックすると、コンテンツが削除されます。

コードは次のとおりです。

$('a').click(function() {
   var id = $(this).attr('class');
 if(id == 'first')
    {
      $('.active').removeClass('active');   
      $('a.first').addClass('active');  
    } 
else if(id == 'second')    
     {
      $('.active').removeClass('active');   
      $('a.second').addClass('active');  
    } 

   $('#first').toggle(id == 'first');

   $('#second').toggle(id == 'second');
});​

HTML:

<a class="first">one</a>
<a class="second">two</a>
<div>
   <li id="first">
       <h2>pen</h2>
       <div>
           <div>parker</div>
       </div>
  </li>
  <li id="second" style="display: none;">
        <h2>car</h2>
        <div>Bugatti</div>
     </div>
   </li>
</div>​

CSS:

.active { color: green; }​
4

2 に答える 2

4

コードを使用した最も簡単な回避策は、クリック コールバック関数でチェック条件を使用することです。

http://jsfiddle.net/UuFgt/

if($(this).is('.active')) return false;
于 2012-11-14T17:01:48.110 に答える
-1

コンテンツを「ロード」しているのではなく、非表示にした後（ で）表示しているだけdisplay: noneです。したがって、コンテンツは「削除」されるのではなく、非表示になります。を使用するときはいつでもremoveClass('active');、対応する要素を非表示にします。toggle()あなたのコードのアイデアは何ですか? 使い方が間違っていると思います。2 つを逆にするか (1 番目に 2 番目、2 番目に 1 番目を使用)、または別の方法で行う必要があります。

于 2012-11-14T17:06:29.357 に答える