jquery 3.3.1 Uncaught TypeError: e.indexOf is not a function at w.fn.init.w.fn.load
14,492
Problem : zoomsl does not work with jquery 3.3.1 version
Error :
Solution :
You need to change
new Image()
.load()
function in zoomsl-3.0.jsApply
$("img").one("load", function() { ... }
therePlease check codepen example here
Old Code:
$.fn.imagezoomsl = function(options){
options = options || {};
return this.each(function(){
if (!$(this).is("img")) return true;
var that = this;
setTimeout(function () {
$(new Image()).load(function(){//this is old line
sergelandimagezoomer.init($(that), options);
}).attr('src', $(that).attr('src'));
}, 30);
});
};
New Code:
$.fn.imagezoomsl = function(options){
options = options || {};
return this.each(function(){
if (!$(this).is("img")) return true;
var that = this;
setTimeout(function () {
$("img").one("load", function() {//new code
sergelandimagezoomer.init($(that), options);
}).attr('src', $(that).attr('src'));
}, 30);
});
};
You can see that $("img").one("load", function() { ... }
is applied in setTimeout
function.
Just change this line and it will start working.
This change will keep working in jquery older versions too.
I hope you found the solution, please fill free to ask question.
Related videos on Youtube
Author by
Ammar
Updated on June 04, 2022Comments
-
Ammar about 2 years
<img class="my-foto" src="fashion-033-thumb.jpg" data-large="fashion-033.jpg"> <!-- Optional JavaScript --> <!-- <script src="jquery-1.8.2.min.js"></script> --> <script src="jquery-3.3.1.min.js"></script> <script src="zoomsl-3.0.js"></script> <script> $(function() { $('.my-foto').imagezoomsl({ zoomrange: [3, 3] }); }); </script>
zoomsl does not work with jquery 3.3.1 version console throw e.indexOf is not a function error
-
Sigma over 5 yearsAccording to documentation you should use: jQuery(function() please make sure jquery is loading checking there are no errors from dev tools with inspector.
-
Alejandro Lozdziejski almost 5 yearsSigma's comment is not helpful at all... w.fn.init.w.fn.load is a jQuery function which means that JQuery code is actually loaded and executing. Moreover, the title of the question itself is the javascript output from devtools
-