javascript - AddEventListener で関数を渡しました

Question

関数をメソッドに渡したとき、addEventListener()正しく動作しません。イベントが登録されず、関数が呼び出されません。

コード

 <div id="box-wrap">
        <ul id="colorize">
        </ul>
</div>

JavaScript

function colorize(){
var ul = document.getElementById('colorize');

for(var i = 0; i < 36; i++){
    ul.appendChild(document.createElement('li'));
}

function randomColor(li){
    li.style.background= "#"+(Math.random()*0xFFFFFF<<0).toString(16);


}
var liElements = ul.children;
for (i = 0; i < liElements.length; i++){
 liElements[i].addEventListener('mouseover',randomColor(liElements[i]),false);
    }

}

なにが問題ですか？

Answer 1

代わりに試してください

liElements[i].addEventListener('mouseover',randomColor(liElements[i]),false);

バインドを使用します (これは最新のブラウザーでのみ機能することに注意してください)。ただし、リンクにはそのためのフォールバック実装があります)

liElements[i].addEventListener('mouseover',randomColor.bind(this, liElements[i]),false);