adding variable into a jquery plugin

Question

i dont know if it can be done but can you use a variable to use in this instance:

This is the normal way:

jQuery(function() {
    jQuery('#cropbox').Jcrop({
        onChange: showCoords, 
        onSelect: showCoords,
        aspectRatio: 16 / 9
    });
});

wanting to do so like:

var ratioRetrieve = "16 / 9";
var run = true;
if( run === true ) {
    jQuery(function(ratioRetrieve) {
        jQuery('#cropbox').Jcrop({
            onChange: showCoords, 
            onSelect: showCoords,
            aspectRatio: ratioRetrieve
        });
    });
}

EDIT: THIS IS THE FULL CODE

<script language="Javascript">
        $(document).ready(function(){ 
            /**************************** ASPECT RATIO ********************************/
            function getAspectRation(w, h){
                var rem;
                var newW = w;
                var newH = h;           
                while (h != 0) {
                    rem = w % h;
                    w = h;
                    h = rem;
                }           
                newH = newH / w;
                newW = newW / w;            
                return newW / newH;
            }
            function calcRatio(){
                $(".heightAndWidth").keypress(function (e) {
                    var newW = $("#outputImageWidth").val();
                    var newH = $("#outputImageHeight").val();
                    var ratioRetrieve = getAspectRation(newW, newH);    
                    return ratioRetrieve;
                });
            }
            function calcRatio2(){
                var newW = $("#outputImageWidth").val();
                var newH = $("#outputImageHeight").val();
                var ratioRetrieve = getAspectRation(newW, newH);
                return ratioRetrieve;
            }
            /**************************** END ASPECT RATIO ********************************/
            /**************** REPLACE TO MAKE ALL NON MOVABLE ANCHORS *********************/
            function anchorChange(){
                $("a").each(function(i){
                    var anchorElement = $(this);
                    var newAnchorElement = $('<a href="#link01' + i + '" id="' + anchorElement.attr('id') + '" class="' + anchorElement.attr('class') + '" name="#link01' + i + '">' + anchorElement.text() + '</a>').insertBefore(anchorElement);
                        anchorElement.remove();
                }); 
            }
            /************** REPLACE TO MAKE ALL NON MOVABLE ANCHORS END *******************/
            /**************************** CLOSE PREVIEW BUTTON ****************************/
            function closePreview(){
                $("#closePreviewButton").bind("click", function(){
                    $("#cropResult").animate({
                        height: "0px"                                     
                    }, 1000, 
                    function(){
                        $("#cropResult").remove();  
                    });
                });
            }
            /*********************** END CLOSE PREVIEW BUTTON ****************************/
            /************************** GET HEIGHT AND WIDTH *****************************/
            function getHeightOrWidth(){
                $("#getHeight").bind("click", function(){
                    var heightOrWidthVal = $("#outputImageHeight").val();
                    var newImagejCrop = $("#filename").val();
                    var folderjCrop = $("#hiddenFolder").val();
                    var imageDir = folderjCrop + newImagejCrop;
                    $("#heightWidthLoad").html('<p>Retrieving height... <img src="../../loader.gif" /></p>');

                    $.ajax({
                        type: "POST", 
                        data: 'dir=' + imageDir + '&heightOrWidth=height', 
                        url: 'https://web111.secure-secure.co.uk/snowyswebsolutions.co.uk/ACTfileUploader/imageCrop/func.getSize.php', 
                        cache: false, 
                        timeout: 12000, 
                        error: function(XMLHttpRequest, textStatus, errorThrow){
                            $("#heightWidthLoad").html(
                            "<span class=\"red\">Error: Network connection low, please try again later.</span>"
                        );},  
                        success: 
                        function(html){
                            $("#outputImageHeight").val(html);  
                            ratioRetrieve = calcRatio2();
                            $("#heightWidthLoad").html('');
                        }
                    });
                });
                $("#getWidth").bind("click", function(){
                    var heightOrWidthVal = $("#outputImageWidth").val();
                    var newImagejCrop = $("#filename").val();
                    var folderjCrop = $("#hiddenFolder").val();
                    var imageDir = folderjCrop + newImagejCrop;
                    $("#heightWidthLoad").html('<p>Retrieving width... <img src="../../loader.gif" /></p>');

                    $.ajax({
                        type: "POST", 
                        data: 'dir=' + imageDir + '&heightOrWidth=width', 
                        url: 'https://web111.secure-secure.co.uk/snowyswebsolutions.co.uk/ACTfileUploader/imageCrop/func.getSize.php', 
                        cache: false, 
                        timeout: 12000, 
                        error: function(XMLHttpRequest, textStatus, errorThrow){
                            $("#heightWidthLoad").html(
                            "<span class=\"red\">Error: Network connection low, please try again later.</span>"
                        );},  
                        success: 
                        function(html){
                            $("#outputImageWidth").val(html);
                            ratioRetrieve = calcRatio2();
                            $("#heightWidthLoad").html('');
                        }
                    });
                });
            }
            /************************** GET HEIGHT AND WIDTH EMD **************************/
            /**************** REMOVE AND INSERT JCROP WITH IMAGE CHANGE *******************/
            function imageChangejCrop(ratioRetrieve){
                run = false;
                $("#imageList").change(function(ratioRetrieve){ 
                    var newImagejCrop = $("#imageList :selected").text();
                    var folderjCrop = $("#hiddenFolder").val();
                    $(".jcrop-holder").remove();
                    $("#cropbox").remove();
                    $("#imageWrapper").html("<img src=\"" + folderjCrop + newImagejCrop + "\" id=\"cropbox\" />");
                    $("#filename").val(newImagejCrop);
                    run = true;
                    jQuery('#cropbox').Jcrop({
                        onChange: showCoords, 
                        onSelect: showCoords, 
                        aspectRatio: parseInt(ratioRetrieve)
                    });
                    function showCoords(c){
                        jQuery('#x').val(c.x);
                        jQuery('#y').val(c.y);
                        jQuery('#x2').val(c.x2);
                        jQuery('#y2').val(c.y2);
                        jQuery('#w').val(c.w);
                        jQuery('#h').val(c.h);
                    };

                    function checkCoords(){
                        if (parseInt(jQuery('#w').val())) return true;
                        alert('Please select a crop region then press submit.');
                        return false;
                    };
                });
            }
            /************** REMOVE AND INSERT JCROP WITH IMAGE CHANGE END ***************/

            imageChangejCrop();
            closePreview();
            anchorChange();
            getHeightOrWidth();
            ratioRetrieve = calcRatio();

        });

        /***************************************************************************/

        jQuery(window).load(function() {
            var run = true;
            if( run === true ) {
                jQuery(function(ratioRetrieve) {
                    jQuery('#cropbox').Jcrop({
                        onChange: showCoords, 
                        onSelect: showCoords,
                        aspectRatio: parseInt(ratioRetrieve)
                    });

                });
            }
            function showCoords(c){
                jQuery('#x').val(c.x);
                jQuery('#y').val(c.y);
                jQuery('#x2').val(c.x2);
                jQuery('#y2').val(c.y2);
                jQuery('#w').val(c.w);
                jQuery('#h').val(c.h);
            };
            function checkCoords(){
                if (parseInt(jQuery('#w').val())) return true;
                alert('Please select a crop region then press submit.');
                return false;
            };
        }); 
    </script>

Answer 1

只要可以从调用它的位置访问变量的范围，就应该没有问题。

Answer 2

You can, but in the snippet that you posted ratioRetrieve is a string, rather than an integer (and "16 / 9" is not the same as 16 / 9). You can use it like var ratioRetrieve = 16 / 9;

Answer 3

@Phil Jackson comment to Alexander Gyoshev

Are you sure getAspectRation should return an integer? eg if you do that 16/9 would return 1 .

I guess what you really want is float. But your function should return a float anyway without changing anything.

Else if you somewhere have a number (not an expression) as string and you need it as number do

var x = "0.5123";
return parseInt(x); //if you really want an integer
return parseFloat(x); //if you want a float

So if you really want getAspectRation to return an integer you could do

return parseInt(newW / newH);