Question

JQuery的新手，还在学习......

单击图像时，下面的脚本会交换div的类。如何隔离图像，以便只有类型为.thumbnail的图像才会触发脚本？

< script >

  $(document).ready(function(){
    $("img").click(function(e) {
      var newclass = $(this).attr("class");
      var oldclass = $("#fullsize").attr('class');
      $("#fullsize").removeClass(oldclass).addClass(newclass);
    })
  }); 

< /script>

Answer 1

$("img.thumbnail ").click(function(e) { // add the class along with the img selector
  var newclass = $(this).attr("id");
  var oldclass = $("#fullsize").attr('class');
  $("#fullsize").removeClass(oldclass).addClass(newclass);
})

This link可以帮助您理解jQuery中的不同选择器

Answer 2

$('img')将选择您文档中的所有img。

$('img.thumbnail')将选择文档中包含thumbnail类的所有img。

您只需更换class属性即可合并removeClass addClass操作。

$('img.thumbnail').click(function(e) {
    var newclass = $(this).attr('id');
    var oldclass = $('#fullsize').attr('class');
    $('#fullsize').attr('class',newClass); // Note: No need to removeClass and then addClass. Simply Replace the value of class attribute.
});

Answer 3

你可以这样做

<script>
 $(document).ready(function() {       
   $("img.thumbnail").click(function(e) {           
     var newclass = $(this).attr("id");               
     var oldclass = $("#fullsize").attr('class');  
     $("#fullsize").removeClass(oldclass).addClass(newclass);  
   });                  
});
</script>

在处理事件时，如何使用特定类来定位元素？

3 个答案: