鼠标上变更按钮

我有一组按钮。我希望当我在其中一个按钮上按下鼠标时，该特定按钮将改变其背景颜色，而所有其他按钮将保持不变。鼠标上变更按钮

任何帮助如何做到这一点，而没有任何回发。

2012-03-24 IT_info

只需在按钮上使用onclick处理程序。在一个'asp：Button'中，你为一个属性写了'OnClientClick'（而不是'OnClick'，它做了一个回发）。 – 2012-03-24 07:43:24

使用CSS伪选择器'：hover' – 2012-03-24 07:47:45

在鼠标上_up_？您不想在鼠标_down_上更改它，然后将其重置为鼠标_up_？如果你只在鼠标上进行操作，颜色变化将是永久的......请显示按钮的HTML，以及它们所包含的任何对象（假设它们处于表单或div或其他内容）。 – nnnnnn 2012-03-24 07:55:59

这里做一个相当笨重的办法：

<style> 
.selected { background-color : red; } 
</style> 
<script> 
var theForm = document.getElementById("someForm"); 
theForm.onmouseup = function(e) { 
    // allow for IE 
    if (!e) e = window.event; 

    var src = e.srcElement || e.target; 

    if (src.tagName.toLowerCase() === "input" 
     && src.type.toLowerCase() === "button"){ 
     src.className = "selected"; 
     for (var i = 0; i < theForm.children.length; i++) 
      if (src != theForm.children[i]) 
       theForm.children[i].className = ""; 
    }    
}; 
</script>

演示：http://jsfiddle.net/Yn3pT/

这是假设按钮是一个名为“someForm”和形式的孩子，“选择”一类的存在具有适当的色彩 - 显然你会修改这个适当，以满足您标记。

请注意，上述应该位于onload处理程序中，或者脚本块应位于源中元素之后的某处。

请注意，onclick会比onmouseup更合适。

来源

2012-03-24 08:20:27 nnnnnn

<button class="mouseup"> Click me </button> 
<button class="mouseup"> Click me </button> 
<button class="mouseup"> Click me </button>

$buttons = document.getElementsByClassName('mouseup'); 

for(var i = 0; i < $buttons.length; i++) 
{ 
    $buttons[i].onmouseup= function(){ 
     this.style.background = 'blue'; 
     for(var j = 0; j < $buttons.length; j++) 
      if($buttons[j] != this) 
       $buttons[j].style.background = '#F0F0F0'; 
    } 
}

http://jsfiddle.net/nQHup/5/

来源

2012-03-24 07:56:57

鼠标上变更按钮

回答

相关问题