背景色を反転するjQuery

Question

背景色をランダムにしてテキストの色を反転させる有望なコードがいくつか見つかりましたが、これを動作させるようには見えません。どんな助けでも大歓迎です。

$(document).ready(function() { 
var colors = ['#000000', '#FF3516', '#34FF17', '#2458FF']; 
function UpdateColors() { 
    $(this).each(function(index) { 
     var color = colors[Math.floor(Math.random() * colors.length)]; 
     var invertedColor = invertColor(color); 
     $(this).css({ 
      'background-color': color, 
      'color': invertedColor 
     }); 
    }); 
} 
//$('div').UpdateColors(); 
}); 

ここフィドル：

https://jsfiddle.net/abennington/h49zh3gy/10/

Answer 1

jQueryを拡張していないので、$（ 'div'）。UpdateColors（）関数が表示されませんでした。

私はあなたが道の機能を使用できることを微調整しました：invertColor機能がどこにも定義されていないとして、あなたはまだエラーになりますが、このフィドルhttps://jsfiddle.net/h49zh3gy/11/

を参照してくださいjQuery.fn.UpdateColors = function() { ... }

を。

Answer 2

あなたは要素の特定の要素またはセットでごcss()メソッドを呼び出すする必要があります。 $(this)は、使用しているコンテキストでは機能しません。だから、

、あなたはすべての要素のためにこれをやろうとしているように見えることから：

$(document).ready(function() { 
    var colors = ['#000000', '#FF3516', '#34FF17', '#2458FF']; 
    $("*").each(function() { 
     var color = colors[Math.floor(Math.random() * colors.length)]; 
     var invertedColor = invertColor(color); 
     $(this).css({ 'background-color': color, 'color': invertedColor }); 
    }); 
}); 

あなただけのbody要素にこれをしたい場合は、"body"で"*"を交換してください。

（私はあなたのinvertColor()機能が動作することを想定しています。）

編集：私は、私は少しあなたのポイントを逃したと思います。 $を延長すると、コメントアウトした通話の最下部にあるように機能を呼び出すことができます。しかし、私のコードは、もしあなたが$で悩んでいる（私の意見では、少しばかばかしい）経路に行きたくない場合にはまだ機能します。