バニラJavaScriptバインドmouseoutイベント

Question

NO JQUERY !!!!!!

私はこれを純粋なJSで書く必要があります。カレンダーのタイムラインに複数の要素があり、いくつかはinvoice_idでリンクされているので、マウスが1つ上にマウスを置いたときにすべてのクラス要素にホバークラスを追加し、マウスでホバークラスを削除します。

私はマウスの上にすべてうまく動作していますが、動作するようにマウスのイベントを出そうと苦労しています。ここ

は私のJSです：

function highlightRange(id) 
{ 
var d = document.getElementsByClassName('invoiceCell' + id); // get all the elements 

d.className += "hover";           // add the hover class 

for (var i = 0; i < d.length; i++) {       // remove the hidden class 
    d[i].classList.remove('hidden'); 
} 

// now how to I bind the mouseout event?? 
} 

私はまさにこれを行うにjQueryを実行するようなスクリプトを持っていますが、このシナリオでは、私はjQueryのを使用することはできません。

jQueryのバージョンは次のようになります。応答後に編集

function highlightRange(id) 
{ 
$(".price_cell_"+id).addClass('hover'); 

$(this).bind("mouseout", function(){ 
    $(".price_cell_"+id).removeClass('hover'); 
}) 
} 

：

function highlightRange(id) 
{ 
var d = document.getElementsByClassName('invoiceCell' + id); // get all the elements 

d.className += "hover";           // add the hover class 

for (var i = 0; i < d.length; i++)        // remove the hidden class 
{ 
    d[i].classList.remove('hidden'); 

    d[i].on('mouseout', function(){ 
     d[i].classList.remove('hover'); 
     d[i].className += "hidden"; 
    }); 
} 
} 

Answer 1

は、あなたが探しているものということですか？

object.addEventListener("mouseout", function(){ 
... 
});