原型點擊，鼠標懸停和鼠標不能一起工作？

我試圖做一個非常簡單的按鈕，基於鼠標懸停，鼠標移動和點擊，我在做原型和奇怪的事情是如果我用鼠標懸停和鼠標，我點擊按鈕後，按鈕不會變成白色，看起來像是因爲鼠標懸停，這是我的代碼原型點擊，鼠標懸停和鼠標不能一起工作？

$("izzy").observe('mouseover', function() { 
    $('izzy').setStyle({ color: '#FFFFFF' }); 
}); 

$("izzy").observe('mouseout', function() { 
    $('izzy').setStyle({ color: '#666666' }); 
}); 

$("izzy").observe('click', function() { 
    $('izzy').setStyle({ color: '#FFFFFF' }); 
});

我該如何解決它？謝謝。

來源

2008-11-05 shibbydoo

除非有別的東西在鼠標和出發生的事情，爲什麼不使用CSS？

#izzy:hover { color: '#FFFFFF'; }

但是，我對你到底想要發生什麼感到困惑。假設你想讓按鈕變成白色，如果它已被點擊或者鼠標移過它。我有click事件處理程序中添加一個點擊的類，如下所示：

$("izzy").observe('click', function() { 
    $('izzy').addClass('selected'); 
});

而CSS爲使

#izzy { color: '#666666'; } 
#izzy:hover, #izzy.selected { color: '#FFFFFF'; }

這有分離狀態的優勢 - 點擊/非點擊鼠標在/不在 - 從風格 - 黑色或灰色。現在他們都混在一起了，造成了混亂，讓自己面對錯誤。

來源

2008-11-05 19:08:13 sblundy

嗯，「選擇」是做什麼的？因爲它不工作......謝謝。 – shibbydoo 2008-11-06 16:20:52

如果在點擊按鈕後將光標移離按鈕，最後一個事件就是鼠標移動，所以無論點擊與否，都會發生。

如果您希望在點擊時避免鼠標移出效果，請嘗試設置標誌，以便在設置標誌時單擊並放棄鼠標移出事件。

來源

2008-11-05 19:01:20 schonarth

你的意思是說，你想要點擊鼠標來引起一個沒有被鼠標替換的樣式的變化嗎？如果是這樣，請嘗試使用一個標誌，像這樣：

var wasClicked = false; 

$("izzy").observe('mouseover', function() { 
    if (!wasClicked) $('izzy').setStyle({ color: '#FFFFFF' }); 
}); 

$("izzy").observe('mouseout', function() { 
    if (!wasClicked) $('izzy').setStyle({ color: '#666666' }); 
}); 

$("izzy").observe('click', function() { 
    $('izzy').setStyle({ color: '#FFFFFF' }); 
    wasClicked = true; 
});

來源

2008-11-05 19:06:56 EndangeredMassa

設置狀態，以防止其他事件：

var clicked = false 
$("izzy").observe('mouseover', function() { 
    if(!clicked) { 
     $('izzy').setStyle({ color: '#FFFFFF' }); 
    } 
}); 

$("izzy").observe('mouseout', function() { 
    if(!clicked) { 
     $('izzy').setStyle({ color: '#666666' }); 
    } 
}); 

$("izzy").observe('click', function() { 
    clicked = true 
    $('izzy').setStyle({ color: '#cccccc' }); 
});

來源

2008-11-05 19:07:59

使用CSS懸停和選定的類對元素着色可能是最佳選擇。但是，如果您只想快速修復代碼，則您已經擁有適當的位置，您可以在點擊鼠標後停止觀察鼠標事件。

$("izzy").observe('click', function(e) { 
    e.element().setStyle({ color: '#FFFFFF' }); 
    e.element().stopObserving('mouseout'); 
});

來源

2008-12-04 20:48:51 thoughtcrimes

原型點擊，鼠標懸停和鼠標不能一起工作？

回答

相關問題