尝试在悬停时更改图像但得到 $var.attr 不是函数错误
Trying to change image on hover but getting $var.attr is not a function error
我试图在将鼠标悬停在另一个较小的缩略图上时更改缩略图(显示颜色变化)。页面上有多组图像。 HTML 是动态生成的,所以我通过 JQuery.
分配 ID
我用来为每张图片分配 ID 的代码(效果很好):
$('.pretty-item .image-container > a img').each(function (index) {
$(this).attr("id","id" + index);
});
代码中的问题行:
$('.pretty-item .image-container > a img').each(function() {
var $mainImg = $(this).attr('id');
$(".catalog-tiny-thumbnail").mouseover(function(){
var src = $(this).attr("src");
var doubleWidth = $(this).width()*2;
var doubleHeight = $(this).height()*2;
$mainImg.attr($("src"),src);
$mainImg.css({"width":doubleWidth,
"height:":doubleHeight});
});
});
$mainImg.attr($("src"), src);正在给出 Uncaught TypeError: $mainImage.attr is not a function
我哪里错了?
$mainImg
只是一张图片的id,所以
$mainImg.attr($("src"),src);
应该是
$("#" + $mainImg).attr("src",src);
同样适用于
$mainImg.css({"width":doubleWidth,"height:":doubleHeight});
应该是
$("#" + $mainImg).css({"width":doubleWidth,"height:":doubleHeight});
我试图在将鼠标悬停在另一个较小的缩略图上时更改缩略图(显示颜色变化)。页面上有多组图像。 HTML 是动态生成的,所以我通过 JQuery.
分配 ID我用来为每张图片分配 ID 的代码(效果很好):
$('.pretty-item .image-container > a img').each(function (index) {
$(this).attr("id","id" + index);
});
代码中的问题行:
$('.pretty-item .image-container > a img').each(function() {
var $mainImg = $(this).attr('id');
$(".catalog-tiny-thumbnail").mouseover(function(){
var src = $(this).attr("src");
var doubleWidth = $(this).width()*2;
var doubleHeight = $(this).height()*2;
$mainImg.attr($("src"),src);
$mainImg.css({"width":doubleWidth,
"height:":doubleHeight});
});
});
$mainImg.attr($("src"), src);正在给出 Uncaught TypeError: $mainImage.attr is not a function
我哪里错了?
$mainImg
只是一张图片的id,所以
$mainImg.attr($("src"),src);
应该是
$("#" + $mainImg).attr("src",src);
同样适用于
$mainImg.css({"width":doubleWidth,"height:":doubleHeight});
应该是
$("#" + $mainImg).css({"width":doubleWidth,"height:":doubleHeight});