0

誰かがこれを手伝ってくれることを願っています。私のページのjQueryタブは背景画像を使用しており、クリックされたリンク（アクティブステータスの場合）にid = "current"を追加しようとしており、他のリンクからIDを削除したいと考えています。また、ページが開いたときに最初のタブにIDを設定する必要があります。私が試したすべてのことは、すべてのリンクからid = "current"を削除するか、すべてのリンクに追加します。今後のヘルプに事前に感謝します。〜c

**jQuery**
<script type="text/javascript">
$(function(){   
$( "#tabs" ).tabs();

$('#tabs a').click(function(){
$(this).parent().attr('id', 'current');
('li #current').removeAttr('id', 'current');
});

});
</script>



CSS
#tabs a { float:left;background:url(images/tabLeft.png) no-repeat left top;}
#tabs a span { float:left;display:block;background:url(images/tabRight.png) no-repeat  right top;}/*grey bg*/
#tabs #current a { background-position:0% -30px;} /*purple bg*/
#tabs #current a span { background-position:100% -30px;} 

HTML
 <div id="tabs">
 <ul>
 <li id="current"><a href="#tabs-1"><span>Tab 1</span></a></li>
   <li><a href="#tabs-2"><span>Tab 2</span></a></li>
   <li><a href="#tabs-3"><span>Tab 3</span></a></li>
   <li><a href="#tabs-4"><span>Tab 4</span></a></li>
   <li><a href="#tabs-5"><span>Tab 5</span></a></li>
    </ul>

    <div id="tabs-1" >Tab 1 Content</div>
    <div id="tabs-2" >Tab 2 Content</div>
    <div id="tabs-3" >Tab 3 Content</div>
    <div id="tabs-4" >Tab 4 Content</div>
    <div id="tabs-5" >Tab 5 Content</div>

</div>
4

1 に答える 1

1

まず、その種の ID の使用をやめてください。クラスを使用して要素を操作し、クラスを切り替える方法を確認するために、例を作成しました。

$('.tab li a').click( function(){
$('.tab li a').parent().find('.current').removeClass('current');
$(this).addClass('current');
});

http://jsfiddle.net/madaaah/hX4hE/

于 2013-03-14T19:36:42.743 に答える