0

jQuery.Color オブジェクトを返す関数を作成する必要がありますが、その方法がわかりません。ここにコード例があります

function newcolor () { var obj =  new $.Color( 'rgb(0,0,0)' ); return obj;}

var foo = newcolor();

foo.red();

編集:

私の完全なコード:

function my (element,a,b,c){ //class my
   this.target = $(elem);
   this.new_color = function (a,b,c) { return new $.Color( 'rgb('+a+','+b+','+c+')'); }
   this.base_color = new_color (a,b,c);
   this.colorize = function () ( this.target.css({ background-color: new_color });
}

var div = new My($('foo'),0,0,0);
div.new_color(255,255,255);
div.colorize();

私の目標は、jquery 要素を保持して操作できるクラスを作成することです。今、私は $.Color() を返すことに固執しています。

4

1 に答える 1

1

このようなものはどうですか:

function My(elem,r,g,b){ //class my

  this.setColor = function(r,g,b) {
    this.r = (r || 0);
    this.g = (g || 0);
    this.b = (b || 0);
  };

  this.colorArray = function() {
    return [this.r, this.g, this.b];
  };

  this.colorString = function() {
    return "rgb(" + this.colorArray().join(",") + ")";
  };

  this.colorize = function(r,g,b) {
    if (r && g && b) {
      this.setColor(r,g,b);
    }
    var color = $.Color(this.colorString());
    this.target.css({backgroundColor: color});
  }

  // initialize
  this.target = $(elem);
  this.setColor(r,g,b);
  this.colorize();
};

var div1 = new My($('#div1'),100,20,40);
div1.setColor(255,255,200);
div1.colorize();

var div2 = new My($('#div2'),100,20,40);

基本的にいくつかのラッパー関数を追加し、インスタンスの個別の r、g、b 値を格納しただけであることに気付くでしょう。次に、最後の最後に必要なときにのみ j1Query.Color メソッドを呼び出します。その場合、カラー インスタンスを配置する必要はありません。

これもcodepenに入れました: http://codepen.io/bunnymatic/pen/yLxwp

于 2013-11-09T20:43:52.017 に答える