使用jQuery設置di​​v的屬性使用jQuery

Question

我想爲div設置一個屬性。我已經做到了這一點：

$('#row-img_1').onmouseover = function(){ alert('foo'); }; 
$('#row-img_2').onmouseout = function(){ alert('foo2'); }; 

然而，上面沒有奏效，當鼠標移動到或當它移動了它不會發出警報。

我也嘗試了$('#row-img_1').attr();，我也無法讓這個工作。

我知道我應該使用更有效的事件處理系統，但我的div是動態生成的。另外這是一個小項目。 ;）

謝謝大家的幫助。

Answer 1

$('#row-img_1').bind('mouseenter', function(event){ 
    // event handler for mouseenter 
}); 

$('#row-img_1').bind('mouseleave', function(event){ 
    // event handler for mouseleave 
}); 

或使用jQuerys懸停事件，您需要將事件函數綁定到的元素。設置事件屬性不起作用，因爲只有在加載頁面時才解釋它們。因此，你需要將事件回調連接以不同的方式：

$('#row-img_1').mouseover(function() { 
    alert('foo'); 
}); 
$('#row-img_2').mouseout(function() { 
    alert('foo2'); 
}); 

在jQuery中，有兩個事件：mouseenter和mouseleave。這些是相似的，但mouseenter不會在將鼠標從子元素移動到主元素時觸發，而mouseover將再次觸發該事件。相同的邏輯適用於mouseleave vs mouseout。

但是，jquery爲這種用法提供了一個快捷方式：.hover方法。

Answer 2

事件被註冊爲作爲屬性傳遞功能，如：

$('#row-img_1').mouseover(function(){ alert('foo'); }); 
$('#row-img_2').mouseout(function(){ alert('foo2'); }); 

另外，還要注意從onmouseover失蹤on。其用途不同不相同

$('#row-img_1').hover(function(){ 
    // event handler for mouseenter 
}, function(){ 
    // event handler for mouseleave 

}); 

Answer 3

$('#row-img_1').mouseover(function() { 
    alert('foo'); 
}); 

Answer 4