我认为我在renderGrid()中的元素包含一个html元素,所以我想用这个替换"#container“。简单地说,我想让我的代码变得通用,因为现在我只能将它用于"#container“,所以"#container”必须替换为模板之类的东西。
function renderGrid(element, settings) {
var x = settings.columns;
var y = result.length / x;
$('.grid').remove();
for (var cols = 0; cols < x; cols++) {
for (var rows = 0; rows < y; rows++) {
numberOfTiles = x * y;
$('#container').append("<div class='grid'><div class = 'usernameSpace'></div></div>");
};
};
$('.grid').width(800 / x);
$('.grid').height(800 / x);
}
(function ($) {
$.fn.tiles = function (options) {
var settings = getOptions(options);
return this.each(function () {
var grid = renderGrid(this, options);
fillTilesWithContent(this, options);
colorTiles(this, options);
columnCountSet(this,options);
return grid;
});
}
})(jQuery);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
发布于 2018-08-08 05:16:19
例如,可以将相关方法放入一个类中并设置一个类变量
Class GridRenderer {
var _container;
function call(element, settings) {
_container = element;
renderGrid(settings);
}
function createGrid(x, y) {
$('.grid').remove();
for (var cols = 0; cols < x; cols++) {
for (var rows = 0; rows < y; rows++) {
numberOfTiles = x * y;
_container.append("<div class='grid'><div class = 'usernameSpace'></div></div>");
};
};
$('.grid').width(800 / x);
$('.grid').height(800 / x);
};
function refreshGrid(x, y) {
createGrid(x, y);
};
function renderGrid(settings) {
var x = settings.columns;
var y = result.length / x;
refreshGrid(x, y);
}
}
然后
var grid = GridRenderer.call(this, options);
https://stackoverflow.com/questions/51735429
复制相似问题