javascript - jquery 中的多个类和 id 在 safari 中不起作用

Question

下面的代码可以在 Firefox 和 Chrome 中运行，但不能在 Safari 中运行。谁能告诉我这是否是在 jquery 中添加多个类和 id 的正确方法？

jquery

$(document).ready(function () {
$('.imgLink, .imgLink1, .imgLink2, .imgLink3, .imgLink4, .imgLink5, .imgLink6, 
.imgLink7, .imgLink8, .imgLink9').click(function () {
    var imgPath = $(this).attr('href');
    $('#theImage, #theImage1, #theImage2, #theImage3, #theImage4, #theImage5, #theImage6, 
#theImage7, #theImage8, #theImage9').attr('src', imgPath);
    return false;
  });
});

.imgLink 的 html

<a class="imgLink1" href="http://www.customtie.com/images/press/printwear-11-2013.jpg">Printwear Nov 2013</a>

#theImage 的 hmtl

<img id="theImage" src="http://www.customtie.com/images/press/counselor-2-2014.jpg" alt="" width="auto" height="auto">

Answer 1

呃...类不应该这样使用。相反:

<a href="images/foo.jpg" data-targetid="1" class="imgLink">FOO</a>
<a href="images/bar.jpg" data-targetid="2" class="imgLink">BAR</a>

<img id="theImage1" src="images/default.jpg" alt="">
<img id="theImage2" src="images/default.jpg" alt="">

$(function () { // DOM ready shorthand

  $('.imgLink').click(function ( e ) {
       e.preventDefault();
       var imgPath = $(this).attr('href');
       var targetID = $(this).data('targetid');
       $('#theImage'+ targetID).attr('src', imgPath);
  });

});

|→ jsBin demo

所以基本上，您将相同的类添加到所有可点击中，并添加一个带有图像 ID 后缀编号的 data-* 属性您想要定位。

_{还有其他很好的方法(甚至更简单)来实现相同的目的，但如果没有看到一些 HTML，那就是盲目猜测。}