Jquery $this.css（…）为空或不是IE8上的可拖动对象的背景插件

“$this.css（…）”为空或不是对象

获取此错误，但仅在IE中（未在8以上测试，不需要在8以下测试）

我一直在使用这个插件，这就是错误的来源。我将在下面发生错误的地方放一些代码——这是该代码段的第三行

    var x0 = e.clientX
      , y0 = e.clientY
      , pos = $this.css('background-position').match(/(-?\d+).*?\s(-?\d+)/) || []
      , xPos = parseInt(pos[1]) || 0
      , yPos = parseInt(pos[2]) || 0

当我试图点击并拖动来移动背景时，就会发生这种情况，它只是直接出错

有什么建议吗

谢谢

编辑：下面是完整的脚本

  !function($) {
    var $window = $(window)

    // Helper function to guarantee a value between low and hi unless bool is false
    var limit = function(low, hi, value, bool) {
      if (arguments.length === 3 || bool) {
        if (value < low) return low
        if (value > hi) return hi
      }
      return value
    }

    // Adds clientX and clientY properties to the jQuery's event object from touch
    var modifyEventForTouch = function(e) {
      e.clientX = e.originalEvent.touches[0].clientX
      e.clientY = e.originalEvent.touches[0].clientY
    }

    $.fn.backgroundDraggable = function(options) {
      var options = $.extend({}, $.fn.backgroundDraggable.defaults, options)

      return this.each(function() {
        var $this = $(this)
          , $bg = $this.css('background-image')
          , src = $bg.match(/^url\(['"]?(.*?)['"]?\)$/i)

        // If no background-image css property or no src just return
        if (!$bg || !src) return

        // Get the image's width and height if bound
        var img = { width: 0, height: 0 }
        if (options.bound) {
          var i = new Image
          i.onload = function() {
            img.width = i.width
            img.height = i.height
          }
          i.src = src[1]
        }

        $this.on('mousedown.dbg touchstart.dbg', function(e) {
          e.preventDefault()

          if (e.originalEvent.touches) {
            modifyEventForTouch(e)
          }
          else if (e.which !== 1) {
            return
          }

          var x0 = e.clientX
            , y0 = e.clientY
            , pos = $this.css('background-position').match(/(-?\d+).*?\s(-?\d+)/) || []
            , xPos = parseInt(pos[1]) || 0
            , yPos = parseInt(pos[2]) || 0

          $window.on('mousemove.dbg touchmove.dbg', function(e) {
            e.preventDefault()

            if (e.originalEvent.touches) {
              modifyEventForTouch(e)
            }

            var x = e.clientX
              , y = e.clientY

            xPos = options.axis === 'y' ? xPos : limit($this.innerWidth()-img.width, 0, xPos+x-x0, options.bound)
            yPos = options.axis === 'x' ? yPos : limit($this.innerHeight()-img.height, 0, yPos+y-y0, options.bound)
            x0 = x
            y0 = y

            $this.css('background-position', xPos + 'px ' + yPos + 'px')
          })
        })

        $window.on('mouseup.dbg touchend.dbg', function() { $window.off('mousemove.dbg touchmove.dbg') })
      })
    }

    $.fn.backgroundDraggable.defaults = {
      bound: true
    , axis: undefined
    }
  }(jQuery);

！函数（$）{
变量$window=$（窗口）
//除非bool为false，否则Helper函数可确保值介于low和hi之间
var限制=功能（低、高、值、布尔）{
if（arguments.length==3 | | bool）{
如果（值<低）返回低
如果（值>高）返回高
}
返回值
}
//从touch向jQuery的事件对象添加clientX和clientY属性
var modifyEventForTouch=函数（e）{
e、 clientX=e.originalEvent.touch[0]。clientX
e、 clientY=e.originalEvent.touch[0]。clientY
}
$.fn.backgroundDragable=函数（选项）{
var options=$.extend（{}，$.fn.backgroundDraggable.defaults，options）
返回此值。每个（函数（）{
变量$this=$（this）
，$bg=$this.css（'background-image'））
，src=$bg.match（/^url\（[''']？（.*？['']？\）$/i）
//如果没有背景图像css属性或没有src，只需返回
如果（！$bg | |！src）返回
//获取图像的宽度和高度（如果绑定）
var img={宽度：0，高度：0}
if（options.bound）{
var i=新图像
i、 onload=函数（）{
img.width=i.width
img.height=i.height
}
i、 src=src[1]
}
$this.on（'mousedown.dbg touchstart.dbg'，函数（e）{
e、 预防默认值（）
如果（如原始事件接触）{
modifyEventForTouch（e）
}
否则如果（例如，哪个！==1）{
返回
}
var x0=e.clientX
，y0=e.clientY
，pos=$this.css（'background-position'）.match（/（-d+）.*？\s（-\d+/）| |[]
，xPos=parseInt（位置[1]）| | 0
，yPos=parseInt（位置[2]）| | 0
$window.on（'mousemove.dbg touchmove.dbg'，函数（e）{
e、 预防默认值（）
如果（如原始事件接触）{
modifyEventForTouch（e）
}
var x=e.clientX
，y=e.clientY
xPos=options.axis==“y”？xPos:limit（$this.innerWidth（）-img.width，0，xPos+x-x0，options.bound）
yPos=options.axis=='x'？yPos:limit（$this.innerHeight（）-img.height，0，yPos+y-y0，options.bound）
x0=x
y0=y
$this.css（'background-position'，xPos+'px'+yPos+'px'）
})
})
$window.on（'mouseup.dbg touchend.dbg'，function（）{$window.off（'mousemove.dbg touchmove.dbg'））
})
}
$.fn.backgroundDraggable.defaults={
绑定：对
，轴：未定义
}
}（jQuery）；
我想你是指类似于
$（this.css（）
，或
this.css
，依赖于你周围的环境

因此，似乎
$this
被定义为
$（this）
，因此问题在于css值
背景位置
，正如@brewel在评论中指出的：

说

在互联网上再深入一点，答案就出来了：IE不了解选择器的背景位置。它了解非标准的背景位置x和背景位置y

我想你指的是类似于
$（this.css（）
，或者
this.css
，依赖于你周围的环境

因此，似乎
$this
被定义为
$（this）
，因此问题在于css值
背景位置
，正如@brewel在评论中指出的：

说

在互联网上再深入一点，答案就出来了：IE不了解选择器的背景位置。它了解非标准的背景位置x和背景位置y

正如我在对OP的评论中猜测的，并得到另一位评论员的确认，IE 8根本不支持特定的CSS属性，因此
.CSS（）
函数的输出是未定义的

有关更多详细信息，请参阅

您还可以获得一个jQuery插件，该插件在使用IE at（查找bgpos.js模块）时将CSS属性添加到jQuery中。
正如我在对OP的评论中所猜测的，并经另一位评论员确认，IE 8根本不支持该特定CSS属性，因此
.CSS（）
函数的输出未定义

有关更多详细信息，请参阅

您还可以获得一个jQuery插件，该插件在使用IE at（查找bgpos.js模块）时将CSS属性添加到jQuery中。
问题不在于.CSS（）函数，而在于参数。MSIE不读取backgroundPosition，而是读取backgroundPositionX和backgroundPositionY
 问题不是.css（）函数，而是参数。MSIE不读取backgroundPosition，而是读取backgroundPositionX和backgroundPositionY
 当您将css值输出到控制台时，您得到了什么？您是否可以搜索并确保
$this
已在某个地方定义，如果已定义，请在此处发布该值。要么
$this
未定义，或者IE8不支持特定的CSS属性答案在这个线程中：当你将CSS值输出到控制台时，你得到了什么？你能搜索并确保
$this
在某个地方被定义，如果它被定义了，请在这里发布该值。或者
$this
未定义，或者IE8只是不支持特定的CSS属性。答案就在这个线程中：不好意思，不好意思，这样做比nec的时间长