jquery3.1.1报错Uncaught TypeError: a.indexOf is not a function

问题描述

问 题

jquery3.1.1，怎么用的时候报错Uncaught TypeError: a.indexOf is not a function，换成1.9就可以了！
使用的时候是用一个刮奖的插件，代码如下：

<script src="jquery-3.1.1.min.js"></script>
<script src="wScratchPad.min.js"></script>
<script>
  $("#mask_index").wScratchPad({
    size        : 40,
    bg          : "",
    fg          : "p1_bg.jpg",
    realtime    : false,
    scratchDown : null,
    scratchUp   : function(e, percent){
      if(percent > 2){
        this.clear();
        this.enable("enabled", false);
        $("#mask_index").hide(300);
      }
    },
    scratchMove : function(e, percent){
      console.log(percent);
    },
    cursor: "crosshair"
  });
</script>

只要换回1.9就没问题了，插件也不需要用3.1，只是好奇新版本有什么不一样的？

解决方案

我把你的问题复现了一下，然后开始debug，先说下思路，我能看到jq里哪里出错了，但不知道是哪里跳到那里的

1. 参照你说的这个库的demo一个个的排除掉可能的参数引起的错误，发现是fg参数引起的错误，如果是色值就不会报错，说明是图片的处理代码出了问题

2. 找到处理fg的代码，格式化代码，是这里的问题

   a(new Image)
   .attr("src", this.options.fg)
   .load(function () {
       b.ctx.drawImage(this, 0, 0, c, d), b.$img.show()
   })

3. debugger一下，果然是从这里到了报错的地方

4. 对比jq高低版本的这段代码
   3.1.1是这样的

   r.fn.load = function (a, b, c) {
        var d, e, f, g = this,
        h = a.indexOf(" ");

   1.9.0是这样的

   st.fn.load = function (e, n, r) {
   if ("string" != typeof e && Rn) return Rn.apply(this, arguments);
   var i, o, a, s = this,
       u = e.indexOf(" ");

   报错也正是你说的位置，可以看到1.9.0比3.1.1多了一个处理，相信是经过这个处理，e.indexOf这个方法没有报错

5. 两段代码运行到这里的变量都是这样，
   

 这是1.9.0经过处理的变量情况

    这是3.1.1没经过处理的变量情况

至于具体的处理函数我没有仔细看，你想知道的话可以根据我的步骤去看一下

这篇关于jquery3.1.1报错Uncaught TypeError: a.indexOf is not a function的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！