Изменить цвет кнопки при нажатии

Question

Я пробовал пару дней, чтобы найти способ изменить цвет моей кнопки при нажатии на javascript или PHP. У меня уже есть кнопка с CSS: #btnMenu.
Это кнопка:

<a href="/?nav=home"><input id="btnMenu" type="button" value="Hjem"/></a> 

Кнопка: background-color: grey;
Когда он нажал, я хочу, чтобы кнопка: background-color: red;

Я думаю, что это не может быть сделано в CSS, но я могу изменить фон i javascript og PHP?

Answer 1

Я не думаю, что a и button - хорошая комбинация. Однако вы можете использовать этот код для изменения цвета фона кнопки.

document.getElementById('btnMenu').onclick = function(){ 
this.style.backgroundColor = "red"; 
} 

Answer 2

jQuery довольно прост в использовании, чтобы делать подобные вещи. PHP (на стороне сервера) не предназначен для внесения изменений на страницу после ее загрузки.

Вы можете попробовать что-то вроде этого:

$('#btnMenu').click(function(){ 
    $(this).css('background-color', 'red'); 
}); 

Answer 3

document.getElementById('btnMenu').onclick = function(){ 
this.style.backgroundColor = "red"; 
} 

Answer 4

<input type="button" id="btnMenu" value="Hjem" style="color:white" onclick="setColor()"; /> 

var count = 1; 
function setColor() { 
    var property = document.getElementById(btnMenu); 
    if (count == 0) { 
     property.style.backgroundColor = "#FFFFFF" 
     count = 1;   
    } 
    else { 
     property.style.backgroundColor = "#7FFF00" 
     count = 0; 
    } 
} 

Answer 5

Попробуйте это,

JavaScript:

var count = 1; 
    function setColor() { 
     var property = document.getElementById('btnMenu'); 
     if (count == 0) { 
      property.style.backgroundColor = "#FFFFFF" 
      count = 1;   
     } 
     else { 
      property.style.backgroundColor = "#7FFF00" 
      count = 0; 
     } 
    } 

HTML

<input id="btnMenu" type="button" value="Hjem" onclcik="setColor();"/> 

Answer 6

Попробуйте

HTML

<a href="/?nav=home"><input id="btnMenu" type="button" value="Hjem"/></a> 

Javascript

document.getElementById('btnMenu').onclick = function(){ 
this.className = 'blueColor'; 
} 

CSS

.blueColor{ 
    background:blue; 
} 

http://jsfiddle.net/826fhe99/2/

Answer 7

Как вы используете a (якорь) для кнопки, так после нажатия страницы будут обновляться так в таком случае, чтобы изменить цвет кнопки, вы должны попробовать это:

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
<a href="/?nav=home"><input id="btnMenu" type="button" value="Hjem"/></a> 

<script> 
function getParameterByName(name) { 
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); 
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"), 
     results = regex.exec(location.search); 
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); 
} 



    $(document).ready(function(){ 

      var param = getParameterByName('nav'); 
      if(param == 'home'){ 
       $('#btnMenu').css("background-color", "red"); 
      } 

}) 
</script>