为什么 $('a.current').removeClass('current');不工作?

发布于 2024-09-26 07:41:19 字数 2220 浏览 0 评论 0原文

为什么 $('a.current').removeClass('current'); 不适用于此 jquery 选项卡? http://jsfiddle.net/laukstein/ytnw9/8/

 //full JS in http://jsfiddle.net/laukstein/ytnw9/8/
 $(function(){
 var list=$('#list'),
     elementsPerRow=-1,
     loop=true,
     // find first image y-offset to find the number of images per row
     topOffset=list.find('a:eq(0)').offset().top,
     numTabs=list.find('li').length-1,
     current,newCurrent;

 function changeTab(diff){
  // a.current set by jQuery Tools tab plugin
  $('li.current').removeClass('current');
  current=list.find('a.current').parent('li').addClass('current').index();
  newCurrent=(loop)?(current+diff+numTabs+1)%(numTabs+1):current+diff;
 if(loop){
   if(newCurrent>numTabs){newCurrent=0;}
   if(newCurrent<0){newCurrent=numTabs;}
 }else{
   if(newCurrent>numTabs){newCurrent=numTabs;}
   if(newCurrent<0){newCurrent=0;}
 }
  // don't trigger change if tab hasn't changed (for non-looping mode)
 if (current!=newCurrent){
   list.find('li').eq(current).removeClass('current');
   list.find('li').eq(newCurrent).addClass('current').find('a').trigger('click'); // trigger click on tab
 }
 }
 list
  // set up tabs
  .tabs("#content",{effect:'ajax',history:true, xonBeforeClick:function(){changeTab(0)}})
  // find number of images on first row
  .find('a').each(function(i){
      if(elementsPerRow<0&&$(this).offset().top>topOffset){
         elementsPerRow=i;
      }
  });
 //$('a').filter('.current').parent('li').addClass('current'); // Why does not work?
 //$('a.current').parent('li').addClass('current'); // Why does not work?

 $('ul#list li').click(function(){$('li.current').removeClass('current');$(this).addClass('current')});
 $('a.current').removeClass('current'); // Why does not work?
});

HTML:

<ul id="list">
    <li><a href="one.html" title="one">1</a></li>
    <li><a href="two.html" title="two">2</a></li>
    <li><a href="three.html" title="three">3</a></li>
</ul>
<div id="content"></div>​

Why $('a.current').removeClass('current'); is not working for this jquery tabs?
http://jsfiddle.net/laukstein/ytnw9/8/

 //full JS in http://jsfiddle.net/laukstein/ytnw9/8/
 $(function(){
 var list=$('#list'),
     elementsPerRow=-1,
     loop=true,
     // find first image y-offset to find the number of images per row
     topOffset=list.find('a:eq(0)').offset().top,
     numTabs=list.find('li').length-1,
     current,newCurrent;

 function changeTab(diff){
  // a.current set by jQuery Tools tab plugin
  $('li.current').removeClass('current');
  current=list.find('a.current').parent('li').addClass('current').index();
  newCurrent=(loop)?(current+diff+numTabs+1)%(numTabs+1):current+diff;
 if(loop){
   if(newCurrent>numTabs){newCurrent=0;}
   if(newCurrent<0){newCurrent=numTabs;}
 }else{
   if(newCurrent>numTabs){newCurrent=numTabs;}
   if(newCurrent<0){newCurrent=0;}
 }
  // don't trigger change if tab hasn't changed (for non-looping mode)
 if (current!=newCurrent){
   list.find('li').eq(current).removeClass('current');
   list.find('li').eq(newCurrent).addClass('current').find('a').trigger('click'); // trigger click on tab
 }
 }
 list
  // set up tabs
  .tabs("#content",{effect:'ajax',history:true, xonBeforeClick:function(){changeTab(0)}})
  // find number of images on first row
  .find('a').each(function(i){
      if(elementsPerRow<0&&$(this).offset().top>topOffset){
         elementsPerRow=i;
      }
  });
 //$('a').filter('.current').parent('li').addClass('current'); // Why does not work?
 //$('a.current').parent('li').addClass('current'); // Why does not work?

 $('ul#list li').click(function(){$('li.current').removeClass('current');$(this).addClass('current')});
 $('a.current').removeClass('current'); // Why does not work?
});

HTML:

<ul id="list">
    <li><a href="one.html" title="one">1</a></li>
    <li><a href="two.html" title="two">2</a></li>
    <li><a href="three.html" title="three">3</a></li>
</ul>
<div id="content"></div>​

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

初懵 2024-10-03 07:41:19

据我所知(我还没有运行您的代码的工作页面),但似乎“当前”类仅适用于“li”元素。

我认为你的 $("a.current") 将始终包含 0 个元素。

As far as I can tell (I don't yet have a working page running your code), but it appears that the "current" class is only applied to "li" elements.

I think your $("a.current") will always contain 0 elements.

傲性难收 2024-10-03 07:41:19

它不起作用,因为您的页面中没有任何带有 .current 类的

您可以自己检查一下:

alert($('a.current' ).length);

将返回 0...

it doesn't work because you haven't any <a> in your page with the class .current

You can check it out by yourself :

alert($('a.current').length);

will return you 0...

风柔一江水 2024-10-03 07:41:19

您的 .removeClass() 调用正在工作确实 清除类,但是历史记录插件中的这一行:

links.eq(0).trigger("history", [h]);

正在触发您的它加载第一个链接,如 中的默认链接...这将再次选择该链接,将类添加回来,最终是选项卡插件选择第一个选项卡并在这一行:

tab.addClass(conf.current);

将类添加回锚点(此时锚点是 tab )。

这是您的小提琴更新,带有警报,可以更轻松地查看发生的情况

Your .removeClass() call is working does clear the class, but then this line in your history plugin:

links.eq(0).trigger("history", [h]);

Is triggering your it to load the first link as in the <iframe> as the default...which is selecting that link again, adding the class back, it's ultimately the tab plugin selecting the first tab and at this line:

tab.addClass(conf.current);

Adding the class back to the anchor (the anchor is tab at that point).

Here's your fiddle updated with an alert to see what's happening a bit easier.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文