多個圖片切換src地址（點選當前圖片切換src地址，其他圖片仍為預設的狀態）
阿新 • • 發佈：2019-02-02
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <ul class="showSocialList"> <li> <a href="#"><img class="abc" src="images/link0_p.png" durl="images/link0_p.png" data-url="images/link0.png"/></a> </li> <li> <a href="#"><img class="abc" src="images/link1_p.png" durl="images/link1_p.png" data-url="images/link1.png"/></a> </li> <li> <a href="#"><img class="abc" src="images/link2_p.png" durl="images/link2_p.png" data-url="images/link2.png"/></a> </li> </ul> </body> </html> <script src="js/jquery-2.2.4.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> //更換底部圖片的src $('.showSocialList li a img').click(function() { $(".abc").each(function(){ dUrl = $(this).attr('durl'); $(this)[0].src = dUrl; }) dataUrl1 = $(this).attr('data-url'); $(this)[0].src = dataUrl1; }); </script>