Access to a variable from a function

I have a function that has values ​​inserted into variables in another function.

Initialization :

When the window is resized, it runs the resizeImage () function.

$(window).resize(function () { resizeImage(); }); 

Resize Function :

This function checks each element with the image-resize class and adds an SRC adjustment for the image by changing the width value (dynamic from scene7).

The problem is that element.attr ('src', newSrc); newSrc does not exist because it is stored in sizingMethod () .

Is there any way to capture a variable from the sizingMethod () function and put it in element.attr ('src', newSrc); .

 function resizeImage() { $('.image-resize').each(function () { var element = $(this), src = $(this).attr('src'), regx = /wid=\d+(\.\d)*/g, currentWidth, newWidth, newSrc; var attrElement = $(this), attrSrc = $(this).attr('data-zoom-image'), attrRegex = /wid=\d+(\.\d)*/g, attrCurrentWidth, attrNewWidth, attrNewSrc; if ($(window).width() > 1824) { sizingMethod(src, regx, currentWidth, newWidth, newSrc, '2000'); } else if ($(window).width() <= 1824 && $(window).width() > 1366) { sizingMethod(src, regx, currentWidth, newWidth, newSrc, '1824'); } element.attr('src', newSrc); }); }; 

Sizing Function :

 function sizingMethod(sSrc, sRegex, sCurrentW, sNewW, sNewSrc, sNewWidth){ sCurrentW = sSrc.match(sRegex); sNewW = 'wid=' + sNewWidth; sNewSrc = sSrc.replace(sCurrentW, sNewW); textWidth = sNewW.replace('wid=', ''); $(".dsply-screen-size").text($(window).width()); $(".dsply-image-size").text(textWidth); } 
+5
source share
1 answer

When you use a primitive, what you submit is a value, not a reference, so sNewSrc! = NewSrc, so any changes you make to sNewSrc do not change newSrc.

You can fix your code using:


return : returns the value in the sizingMethod function:

 if ($(window).width() > 1824) { newSrc = sizingMethod(src, regx, currentWidth, newWidth, '2000'); } else if ($(window).width() <= 1824 && $(window).width() > 1366) { newSrc = sizingMethod(src, regx, currentWidth, newWidth, '1824'); } 

Calibration function:

 function sizingMethod(sSrc, sRegex, sCurrentW, sNewW, sNewWidth){ sCurrentW = sSrc.match(sRegex); sNewW = 'wid=' + sNewWidth; var sNewSrc = sSrc.replace(sCurrentW, sNewW); textWidth = sNewW.replace('wid=', ''); $(".dsply-screen-size").text($(window).width()); $(".dsply-image-size").text(textWidth); return sNewSrc; } 

closure : if you declare sizingMethod inside an anonymous function, you have access to the newSrc variable and other variables.

 function resizeImage() { $('.image-resize').each(function () { var element = $(this), src = $(this).attr('src'), regx = /wid=\d+(\.\d)*/g, currentWidth, newWidth, newSrc; var attrElement = $(this), attrSrc = $(this).attr('data-zoom-image'), attrRegex = /wid=\d+(\.\d)*/g, attrCurrentWidth, attrNewWidth, attrNewSrc; if ($(window).width() > 1824) { sizingMethod('2000'); } else if ($(window).width() <= 1824 && $(window).width() > 1366) { sizingMethod('1824'); } element.attr('src', newSrc); function sizingMethod(sNewWidth){ currentWidth = src.match(regx); var sNewW = 'wid=' + sNewWidth; newSrc = sSrc.replace(currentWidth, sNewW); textWidth = sNewW.replace('wid=', ''); $(".dsply-screen-size").text($(window).width()); $(".dsply-image-size").text(textWidth); } }); }; 

object : if you use an object / array instead of a primitive as an argument

 function resizeImage() { $('.image-resize').each(function () { var element = $(this), src = $(this).attr('src'), regx = /wid=\d+(\.\d)*/g, currentWidth, newWidth, newSrc = {}; var attrElement = $(this), attrSrc = $(this).attr('data-zoom-image'), attrRegex = /wid=\d+(\.\d)*/g, attrCurrentWidth, attrNewWidth, attrNewSrc; if ($(window).width() > 1824) { sizingMethod(src, regx, currentWidth, newWidth, newSrc, '2000'); } else if ($(window).width() <= 1824 && $(window).width() > 1366) { sizingMethod(src, regx, currentWidth, newWidth, newSrc, '1824'); } element.attr('src', newSrc.src); }); }; 

Calibration function:

 function sizingMethod(sSrc, sRegex, sCurrentW, sNewW, sNewSrc, sNewWidth){ sCurrentW = sSrc.match(sRegex); sNewW = 'wid=' + sNewWidth; sNewSrc.src = sSrc.replace(sCurrentW, sNewW); textWidth = sNewW.replace('wid=', ''); $(".dsply-screen-size").text($(window).width()); $(".dsply-image-size").text(textWidth); } 
+5
source

All Articles