jquery添加和刪除類不工作

我有一個關於在我的javascript代碼中添加和刪除類的問題。jquery添加和刪除類不工作

我創造了這個DEMO從 codepen.io

所以，你可以在演示中看到有一個點擊此處鏈接。當您單擊然後jquery鏈接做

$(document).ready(function() { 
    $('.buton').click(function (event) { 
    event.preventDefault(); 
     $('.vduzalani').animate({'opacity':'.50'}, 300, 'linear'); 
     $('.vduzalani').css('display', 'block'); 
     $(this).next('.yazi-paylas').toggleClass('in'); 

    })  
});

那麼問題是，我想一個.in從.yazi-paylasdiv添加標籤。什麼是我的javascript代碼問題

來源

2015-01-07 innovation

這是因爲.buton是其母公司和.next()唯一的子節點將返回任何結果，如在您的標記中看到：

<div class="container"> 
    <div class="buton"><a href="#">Click Here</a></div> 
    <!-- .buton is the ony sibling! --> 
</div> 
<div class="yazi-paylas">ssss</div> 
<div class="vduzalani"></div>

Y您可以同時使用.parent('.container')（或只是.parent()）或.closest('.container')去一個級別，並選擇.container眼前的兄弟姐妹：

$(document).ready(function() { 
    $('.buton').click(function (event) { 
    event.preventDefault(); 

    // You can use chaining, so you don't have to fetch $('.vduzalani') twice 
    $('.vduzalani') 
    .animate({'opacity':'.50'}, 300, 'linear') 
    .css('display', 'block'); 

    // Tranverse DOM 
    $(this).parent().next('.yazi-paylas').toggleClass('in'); 
    // or 
    // $(this).closest('.container').next('.yazi-paylas').toggleClass('in'); 
    }); 
});

見演示小提琴這裏：http://jsfiddle.net/teddyrised/0g9385k1/

來源

2015-01-07 23:10:38 Terry

如果我想添加另一個類，比如當我點擊'.buton'後，這個按鈕自動添加'.up {z-index：999;}'就像之前點擊'

Click Here

'後點擊'

Click Here

' – innovation

然後只需使用'$（this）.toggleClass（'up'）'。 – Terry

請嘗試：

$('.yazi-paylas').toggleClass('in');

，而不是

$(this).next('.yazi-paylas').toggleClass('in');

來源

2015-01-07 23:10:36

評估父拿到.yazi-paylas元素。你的代碼更改爲：

$(this).parent().next('.yazi-paylas').toggleClass('in');

或者，如果它不事父，只是做：

$('.yazi-paylas').toggleClass('in');

來源

2015-01-07 23:11:47 lante

嘗試用它來取代您的線路：

$(this).parent().next('.yazi-paylas').toggleClass('in');

$（本）在這種情況下，實際上比您嘗試選擇的元素更深一層。

來源

2015-01-07 23:13:42 Marcel

jquery添加和刪除類不工作

回答

相關問題