首页 > 解决方案 > 使用 javascript (this) 将参数传递给另一个函数

问题描述

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

标签: javascript

解决方案


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

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

推荐阅读