1

これは、グーグルの折れ線グラフを描くための私のプラグインの使用法です。

(function( $ ) {
    $.fn.loadLineChart = function(dataArr, title) {

        google.load("visualization", "1", {packages:["corechart"]});
        google.setOnLoadCallback(function() { drawChart(dataArr, title) });

        function drawChart(dataArr, title) {

            var data = google.visualization.arrayToDataTable(dataArr);

            var options = {
                title: title
            };

            var chart = new google.visualization.LineChart($('#chat_div')[0]);
            chart.draw(data, options);
        }
    };
})( jQuery );

私はこのプラグインを次のように呼んでいます。

<script type="text/javascript">        
    var data = '';
    var title = '';

    $('#chart_div').loadLineChart(data, title);
</script>

次に、プラグインに現在の要素chart_divをハードコーディングします。その関数で現在の要素をどのように使用しますか？

4

2 に答える 2

3

jQuery.prototypejQueryプラグインは（のエイリアスである）の単なるメソッドであるため、jQuery.fnプラグイン内のjQueryの現在のインスタンスを次のように参照できますthis。

(function( $ ) {
    $.fn.loadLineChart = function(dataArr, title) {
        var $this = this;
        //...
        function drawChart(dataArr, title) {
            //...
            var chart = new google.visualization.LineChart($this[0]);
        }
    };
})( jQuery );

この場合、関数の値が異なるためthis、loadLineChartメソッドに現在の値への参照を格納する必要があることに注意してください。thisdrawChart

于 2012-11-22T10:49:40.337 に答える
0

プラグインでthisは、プラグインがインスタンス化される要素を参照します。したがって、以下が機能します。

(function( $ ) {
    $.fn.loadLineChart = function(dataArr, title) {
        var $currentElement = this;

        // rest of your code...

        var chart = new google.visualization.LineChart($currentElement[0]);
    };
})( jQuery );

たとえば、要素のグループでプラグインを呼び出す場合は、コレクション$(".foo").loadLineChart();内の各要素をループする必要があります。this

于 2012-11-22T10:49:31.837 に答える