需要切換/刪除類與兄弟選擇器

我有兩個按鈕，當我點擊任何一個功能添加類「選擇」，但如果我推其他按鈕兩個按鈕保持相同的類，我用兄弟姐妹選擇器，但不能正常工作，¿你能幫助我嗎？需要切換/刪除類與兄弟選擇器

$('.btn-switch-view').on('click', function() { 
 
    $(this).addClass('btn-switch-view-selected'); 
 
    $('.btn-group').siblings('a.btn-switch-view-selected').removeClass('btn-switch-view-selected'); 
 
});

.btn-group .btn-default.btn-switch-view { 
 
    color: #b2b2b2; 
 
} 
 
.btn-group a.btn-default.btn-switch-view:hover, 
 
a.btn-default.btn-switch-view-selected { 
 
    color: #1b4298!important; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="btn-group"> 
 
    <a href="#" id="grid" class="btn btn-default btn-sm btn-switch-view"> 
 
    <i class="fa fa-th-large" aria-hidden="true"></i> 
 
    </a> 
 
    <a href="#" id="list" class="btn btn-default btn-sm btn-switch-view"> 
 
    <i class="fa fa-th-list" aria-hidden="true"></i> 
 
    </a> 
 
</div>

來源

2016-10-14 AlonsoCT

我只是格式化你的代碼爲你，但你應該養成早睡早起的習慣自己一直在做這件事。它會幫助你和其他人更快地找出錯誤。 –

'.btn-group'沒有兄弟姐妹是主播嗎？但它確實有兩個孩子是錨。 – adeneo

謝謝adeneo，是正確的！ :) – AlonsoCT

你已經在this錨，現在瞄準兄弟錨，刪除類

$('.btn-switch-view').on('click', function() { 
 
    $(this).addClass('btn-switch-view-selected') 
 
     .siblings() 
 
     .removeClass('btn-switch-view-selected'); 
 
});

.btn-group .btn-default.btn-switch-view { 
 
    color: #b2b2b2; 
 
} 
 
.btn-group a.btn-default.btn-switch-view:hover, 
 
a.btn-default.btn-switch-view-selected { 
 
    color: #1b4298!important; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="btn-group"> 
 
    <a href="#" id="grid" class="btn btn-default btn-sm btn-switch-view"> 
 
    <i class="fa fa-th-large" aria-hidden="true">Button</i> 
 
    </a> 
 
    <a href="#" id="list" class="btn btn-default btn-sm btn-switch-view"> 
 
    <i class="fa fa-th-list" aria-hidden="true">Button</i> 
 
    </a> 
 
</div>

來源

2016-10-14 22:19:45 adeneo

非常感謝你的幫助！ – AlonsoCT

$('.btn-group').siblings('a.btn-switch-view-selected')

應該是

$(this).siblings('a.btn-switch-view-selected')

因爲你是努力的目標的.btn-switch-view兄弟姐妹（這是被點擊的元素），而不是.btn-group

來源

2016-10-14 22:21:49

需要切換/刪除類與兄弟選擇器

回答

相關問題