Javascript If语句不适用于放大镜脚本

如果div activate有一个类“activated”，我希望创建玻璃div。我做错了什么？如果你能告诉我我的错误，那就太好了

  if (ui.zoomer.length + $( '.activate' ).hasClass( "activated" )) {
    var div = document.createElement('div');
    div.setAttribute('class', 'glass');
    ui.glass = $(div);

    $('body').append(div);
  }

以下是完整的代码：

$(function() {

  var native_width = 0;
  var native_height = 0;
  var mouse = {x: 0, y: 0};
  var magnify;
  var cur_img;

  var ui = {
    zoomer: $('.zoomer')
  };

  // Add the magnifying glass
  if (ui.zoomer.length + $( '.activate' ).hasClass( "activated" )) {
    var div = document.createElement('div');
    div.setAttribute('class', 'glass');
    ui.glass = $(div);

    $('body').append(div);
  }


  // All the magnifying will happen on "mousemove"

  var mouseMove = function(e) {
    var $el = $(this);

    // Container offset relative to document
    var magnify_offset = cur_img.offset();

    // Mouse position relative to container
    // pageX/pageY - container's offsetLeft/offetTop
    mouse.x = e.pageX - magnify_offset.left;
    mouse.y = e.pageY - magnify_offset.top;

    // The Magnifying glass should only show up when the mouse is inside
    // It is important to note that attaching mouseout and then hiding
    // the glass wont work cuz mouse will never be out due to the glass
    // being inside the parent and having a higher z-index (positioned above)
    if (
      mouse.x < cur_img.width() &&
      mouse.y < cur_img.height() &&
      mouse.x > 0 &&
      mouse.y > 0
      ) {

      magnify(e);
    }
    else {
      ui.glass.fadeOut(1000);
    }

    return;
  };

  var magnify = function(e) {

    // The background position of div.glass will be
    // changed according to the position
    // of the mouse over the img.zoomer
    //
    // So we will get the ratio of the pixel
    // under the mouse with respect
    // to the image and use that to position the
    // large image inside the magnifying glass

    var rx = Math.round(mouse.x/cur_img.width()*native_width - ui.glass.width()/2)*-1;
    var ry = Math.round(mouse.y/cur_img.height()*native_height - ui.glass.height()/2)*-1;
    var bg_pos = rx + "px " + ry + "px";

    // Calculate pos for magnifying glass
    //
    // Easy Logic: Deduct half of width/height
    // from mouse pos.

    // var glass_left = mouse.x - ui.glass.width() / 2;
    // var glass_top  = mouse.y - ui.glass.height() / 2;
    var glass_left = e.pageX - ui.glass.width() / 2;
    var glass_top  = e.pageY - ui.glass.height() / 2;
    //console.log(glass_left, glass_top, bg_pos)
    // Now, if you hover on the image, you should
    // see the magnifying glass in action
    ui.glass.css({
      left: glass_left,
      top: glass_top,
      backgroundPosition: bg_pos
    });

    return;
  };

  $('.zoomer').on('mousemove', function() {
    ui.glass.fadeIn(1000);

    cur_img = $(this);

    var large_img_loaded = cur_img.data('large-img-loaded');
    var src = cur_img.data('large') || cur_img.attr('src');

    // Set large-img-loaded to true
    // cur_img.data('large-img-loaded', true)

    if (src) {
      ui.glass.css({
        'background-image': 'url(' + src + ')',
        'background-repeat': 'no-repeat'
      });
    }

    // When the user hovers on the image, the script will first calculate
    // the native dimensions if they don't exist. Only after the native dimensions
    // are available, the script will show the zoomed version.
    //if(!native_width && !native_height) {

      if (!cur_img.data('native_width')) {
        // This will create a new image object with the same image as that in .small
        // We cannot directly get the dimensions from .small because of the 
        // width specified to 200px in the html. To get the actual dimensions we have
        // created this image object.
        var image_object = new Image();

        image_object.onload = function() {
          // This code is wrapped in the .load function which is important.
          // width and height of the object would return 0 if accessed before 
          // the image gets loaded.
          native_width = image_object.width;
          native_height = image_object.height;

          cur_img.data('native_width', native_width);
          cur_img.data('native_height', native_height);

          //console.log(native_width, native_height);

          mouseMove.apply(this, arguments);

          ui.glass.on('mousemove', mouseMove);
        };


        image_object.src = src;

        return;
      } else {

        native_width = cur_img.data('native_width');
        native_height = cur_img.data('native_height');
      }
    //}
    //console.log(native_width, native_height);

    mouseMove.apply(this, arguments);

    ui.glass.on('mousemove', mouseMove);
  });

  ui.glass.on('mouseout', function() {
    ui.glass.off('mousemove', mouseMove);
  });

});

$（函数（）{
var native_width=0；
var native_height=0；
变量鼠标={x:0，y:0}；
var放大；
var cur_img；
变量ui={
缩放器：$（“.zoomer”）
};
//加上放大镜
if（ui.zoomer.length+$（'.activate'）.hasClass（“activated”））{
var div=document.createElement（'div'）；
div.setAttribute（'class'，'glass'）；
ui.glass=$（div）；
$（'body'）。追加（div）；
}
//所有的放大都会发生在“mousemove”上
var mouseMove=函数（e）{
var$el=$（本）；
//相对于文档的容器偏移量
变量放大偏移量=当前img.offset（）；
//相对于容器的鼠标位置
//pageX/pageY-集装箱的offsetLeft/offetTop
mouse.x=e.pageX-放大左偏移量；
mouse.y=e.pageY-放大_offset.top；
//只有当鼠标在里面时，放大镜才会出现
//重要的是要注意，将鼠标移出，然后隐藏
//玻璃不起作用，因为玻璃的缘故，鼠标永远不会出来
//位于父级内部且具有更高的z指数（位于上方）
如果(
鼠标.x0&&
鼠标.y>0
) {
放大（e）；
}
否则{
ui.玻璃衰减（1000）；
}
返回；
};
变量放大=函数（e）{
//div.glass的背景位置为
//根据职位变化
//将鼠标放在img.zoomer上
//
//我们将得到像素的比率
//尊敬地在老鼠下面
//到图像，并使用它来定位
//放大镜内的大图像
var rx=Math.round（mouse.x/cur\u img.width（）*native\u width-ui.glass.width（）/2）*-1；
var ry=Math.round（mouse.y/cur\u img.height（）*native\u height-ui.glass.height（）/2）*-1；
变量bg_pos=rx+“px”+ry+“px”；
//计算放大镜的位置
//
//简单逻辑：扣除宽度/高度的一半
//从鼠标位置。
//var glass_left=mouse.x-ui.glass.width（）/2；
//var glass_top=mouse.y-ui.glass.height（）/2；
var glass_left=e.pageX-ui.glass.width（）/2；
var glass_top=e.pageY-ui.glass.height（）/2；
//控制台日志（左侧玻璃，顶部玻璃，背景位置）
//现在，如果您将鼠标悬停在图像上，您应该
//看到放大镜的作用了吗
ui.glass.css({
左：玻璃左，
顶部：玻璃顶部，
背景位置：bg_pos
});
返回；
};
$（'.zoomer'）。在（'mousemove'，function（）上{
ui.glass.fadeIn（1000）；
cur_img=$（本）；
var large_img_loaded=当前img.data（“large-img-loaded”）；
var src=cur_img.data（'large'）| | cur_img.attr（'src'）；
//将加载的大img设置为true
//当前img.数据（“大img-loaded”，真）
if（src）{
ui.glass.css({
“背景图像”：“url（'+src+'），
“背景重复”：“不重复”
});
}
//当用户将鼠标悬停在图像上时，脚本将首先计算
//本机维度（如果不存在）。仅在本机维度之后
//如果可用，脚本将显示缩放的版本。
//如果（！本机_宽度&&！本机_高度）{
如果（！cur\u img.data（'native\u width'））{
//这将创建一个与.small中的图像相同的新图像对象
//我们不能直接从。小的得到尺寸，因为
//在html中指定为200px的宽度。要获取实际尺寸，我们需要
//创建此图像对象。
var image_object=新图像（）；
image\u object.onload=函数（）{
//此代码包装在.load函数中，这一点很重要。
//如果以前访问过，对象的宽度和高度将返回0
//图像将被加载。
本机\u宽度=图像\u对象.width；
本机高度=图像高度=对象高度；
当前图像数据（“本机宽度”，本机宽度）；
当前图像数据（“本机高度”，本机高度）；
//console.log（本机_宽度、本机_高度）；
mouseMove.apply（这个，参数）；
ui.glass.on（'mousemove'，mousemove）；
};
image_object.src=src；
返回；
}否则{
本机宽度=当前图像数据（“本机宽度”）；
本机高度=当前图像数据（“本机高度”）；
}
//}
//console.log（本机_宽度、本机_高度）；
mouseMove.apply（这个，参数）；
ui.glass.on（'mousemove'，mousemove）；
});
ui.glass.on（'mouseout'，function（）{
ui.glass.off（'mousemove'，mousemove）；
});
});

在您的情况下，您应该使用

+

代替：

if (ui.zoomer.length && $( '.activate' ).hasClass( "activated" )) {
    var div = document.createElement('div');
    div.setAttribute('class', 'glass');
    ui.glass = $(div);
    $('body').append(div);
}