jquery 給選中的li標籤新增'select' class,移除兄弟標籤的'select' class
阿新 • • 發佈:2018-11-07
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style> .img li{ display: none; } .img li.select{ display: block; } </style> <body> <!-- 圖片 --> <ul class="img"> <li><img src="" alt=""></li> <li><img src="" alt=""></li> <li><img src="" alt=""></li> <li><img src="" alt=""></li> </ul> <!-- 按鈕 --> <ul class="btn"> <li class="select"></li> <li></li> <li></li> <li></li> </ul> <script> //點選按鈕顯示對應的圖片 $('btn li').click(function(){ var index = $(this).index()+1; $(this).addClass('select').siblings().removeClass('select'); $('img li:nth-child('+index+')').addClass('selectd').siblings().removeClass('selectd'); }) </script> </body> </html>