带回调的jQuery的多个版本

时间:2013-11-20 18:59:21

标签: javascript jquery jquery-ui

我正在使用2个版本的jQuery(CMS需要1.4,我需要1.9用于flot / graphing)。我有这样的设置:

<script type="text/javascript">
    var jQueryOriginal = jQuery.noConflict(true);
</script>

<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.10.3.custom.min.js"></script>
<script type="text/javascript" src="jquery.flot.min.js"></script>
<script type="text/javascript" src="jquery.flot.time.js"></script>
 //Other libraries...

<script type="text/javascript">
   //Save the new jQuery.  
   var jq = jQuery.noConflict( true );
   //Restore the original one.
   jQuery = jQueryOriginal;  
   $ = jQuery;
</script>

我遇到的问题是在我的代码中我做了一个回调来做实际的图形化:

<script type="text/javascript">

    (function($) {
        $(document).ready(function () {
        $('input[id=startDate]').datepicker({ minDate: new Date(2012, 4 - 1, 30), maxDate: -7, dateFormat: 'yy-m-d' });  
        $('input[id=endDate]').datepicker({ minDate: new Date(2012, 4 - 1, 30), maxDate: -7, dateFormat: 'yy-m-d' });  
        // Default to 7 days ago
        var date = new Date(Date.now() - (7*24*60*60*1000)); 
        loadData($.datepicker.formatDate('yy-m-d', date),
            $.datepicker.formatDate('yy-m-d', date), 'plotData');
        })
    })(jq);

    function loadData(start, end, callback) {
        jq("#startDateLabel").text(start);
        jq("#endDateLabel").text(end);
        var URLString="/getJSONData.php?start="+start+"&end="+end+"&callback=?";
        jq.ajax({
            url: URLString,
            dataType: 'jsonp',
            jsonpCallback: callback,
            cache: true,
            success: function(json) {}
       });
    }

    function updateGraph() {
        loadData(jq('input[id=startDate]').val(),jq('input[id=endDate]').val(), 'plotData');
    }
</script>

如何执行此操作以使回调函数(plotData)可以使用我的命名jQuery变量jq

Plotdata看起来像这样:

function plotData(data) {
    var power = [];
    var energy = [];
    var totalEnergy = 0;
    var date = new Date();

    for ( var i = 0; i < data.length; i++) {
            date = parseInt(data[i].Time) * 1000; 
            totalEnergy = totalEnergy + parseFloat(data[i].Energy);
            power.push([ date, data[i].Power / 1000 ]);
            energy.push([ date, totalEnergy / 1000 ]);
    }

 .... //Snip 
    var plot = $.plot($("#container"), [ {
            label : "kWh",
            data : energy,
            color : "rgb(0, 99, 255)",
            yaxis : 2,
            lines : {
                    fill : true
            }
    }, {
            label : "kW",
            data : power,
            color : "rgb(215, 89, 39)",
            yaxis : 1
    } ], options);

}

1 个答案:

答案 0 :(得分:1)

我建议通过在函数体顶部指定jq$来改变你的函数,或者将jq对象作为参数传递:

function plotData(args){
     var $ = jq;
}

OR

function plotData(args, $){

}

plotData(...., jq);