Question

是否可以将相同的jQuery插件应用于同一页面上的多个元素？还是要在插件的不同实例之间共享数据和事件？

我创建了一个jQuery插件，该插件在后台加载服务器数据以显示Highcarts图。

// HTML Code
...
<div id="content">
    <div id="chart1" class="chart" data-src="/url1"...>...</div>
    <div id="chart2" class="chart" data-src="/url2"...>...</div>
</diV>

<script>
    ;(function($) {
        ...
        // Create the Chart-Plugin for every chart element...
        $(".chart").myChart();
    })(jQuery);
</script>


// The Plugin:
;
(function($, window, document, undefined) {
    // Config the Highchart, load data from the data-src url, etc.
})(jQuery, window, document);

这很好，并且在同一页面上处理不同的图表也没问题。每个图表都有自己的插件，并且可以独立处理。

但是：：如果chart1和chart2应该显示/使用完全相同的数据怎么办？

例如，在响应式网页上，可能会将完全相同的图表元素的不同版本放置在不同位置，使用不同样式等。在大屏幕上查看时可以看到一个版本，在移动设备上可以看到一个版本设备等。

当然，上面的代码在这种情况下也可以正常工作，但是不必要两次从服务器加载数据。如果将数据加载一次并应用于图表的所有版本/副本，则将减轻服务器的工作量。

是否存在解决此问题的正确/推荐方法？

在这种情况下，插件仍然是一个好的/可能的解决方案，还是解决这个问题的更好模式？

如何将相同的jQuery插件应用于多个元素？

0 个答案: