Question

我认为我在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>

Answer 1

例如，也许将您的相关方法放在一个类中并设置一个类变量

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);

使用javascript（this）将参数传递给另一个函数

1 个答案: