作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
为什么 $('a.current').parent('li').addClass('current');
和 $(this).hasClass('current')。 parent('li').addClass('current');
不工作?
一个
点击事件必须加上li.current
http://jsfiddle.net/laukstein/ytnw9/
Update: Dropbox is Down, so I updated http://jsfiddle.net/laukstein/ytnw9/1/ with full JS
$(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
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})
// find number of images on first row
.find('a').each(function(i){
// $(this).hasClass('current').parent('li').addClass('current');
if(elementsPerRow<0&&$(this).offset().top>topOffset){
elementsPerRow=i;
}
});
// Set up arrow keys
// Set to document for demo, probably better to use #list in the final version.
$(document).bind('keyup focus',function(e){
var key=e.keyCode;
if(key>36&&key<41){
if(key==37){changeTab(-1);} // Left
if(key==38){changeTab(-elementsPerRow);} // Up
if(key==39){changeTab(+1);} // Right
if(key==40){changeTab(+elementsPerRow);} // Down
e.preventDefault();
}
});
// toggle looping through tabs
$(':button').click(function(){
loop=!loop;
$('#loopStatus').text(loop);
});
$('a.current').parent('li').addClass('current');
});
编辑:从问题中省略的 jsFiddle 链接添加 HTML
<button>Loop</button> <span id="loopStatus">true</span><br />
<ul id="list">
<li><a class="current" href="http://dl.dropbox.com/u/6594481/tabs/one.html" title="one">1</a></li>
<li><a href="http://dl.dropbox.com/u/6594481/tabs/two.html" title="two">2</a></li>
<li><a href="http://dl.dropbox.com/u/6594481/tabs/three.html" title="three">3</a></li>
<li><a href="http://dl.dropbox.com/u/6594481/tabs/four.html" title="four">4</a></li>
<li><a href="http://dl.dropbox.com/u/6594481/tabs/five.html" title="five">5</a></li>
<li><a href="http://dl.dropbox.com/u/6594481/tabs/six.html" title="six">6</a></li>
<li><a href="http://dl.dropbox.com/u/6594481/tabs/seven.html" title="seven">7</a></li>
<li><a href="http://dl.dropbox.com/u/6594481/tabs/eight.html" title="eight">8</a></li>
<li><a href="http://dl.dropbox.com/u/6594481/tabs/nine.html" title="nine">9</a></li>
</ul>
<div id="content" style="clear:both;">Loading...</div>
最佳答案
<罢工> .parent()
只会返回元素的直接父级。
如果元素不是直接在 <li>
中元素,.parent('li')
将返回一个空集。
您可能需要调用
.closest('li')
.
编辑:
<li>
是直系 parent ;那不是你的问题。
hasClass
函数返回一个 bool 值。你的第二行是错误的;你需要调用
.filter
.
关于javascript - 为什么 $ ('a.current' ).parent ('li' ).addClass ('current' );不管用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3865227/
我是一名优秀的程序员,十分优秀!