更改按鈕值，而ID或

Question

類

讓我們假設我的按鈕如下：

<input type="button" value="BLUE" name="button_blue" /> 

我想，當我按一下按鈕，value="BLUE"應改爲value="RED"或任何我想做的。

Answer 1

由於按鈕具有name="button_blue"屬性，使用Attribute Equals Selector

$('[name=button_blue]').on('click',function(){ 
    $(this).val('RED'); 
}); 

工作演示：http://jsfiddle.net/dw8kmh3g/

Answer 2

使用val()方法：

$('button').on('click',function(){ 
    $(this).val('RED'); 
}); 

要改變它在點擊前值再次：

$('button').on('click',function(){ 
    $(this).val($(this).val() == 'RED' ? 'BLUE' : 'RED'); 
}); 

Answer 3

試試這個代碼

$('button').on('click',function(){ 
    $(this).val($(this).val() == "RED" ? "BLUE" : "RED") 
    //OR 
    //this.value = this.value == "RED" ? "BLUE" : "RED"; 
}); 

Answer 4

首先添加一個ID按鈕 -

<input type="button" id="myColorButton" value="BLUE" name="button_blue" /> 

然後將下面的代碼添加到您的腳本 -

document.getElementById("myColorButton").onclick = function() { 
    this.value="RED"; 
}; 

Answer 5

我只想創建一個單獨的CSS類：

.button{ 
background-color:red; 
} 

，然後添加上單擊類：

$('#button').on('click',function(){ 
!$(this).hasClass('ButtonClicked') ? addClass('button') : ''; 
}); 

您還可以創建有一個「ON/OFF」開關通過切換類感知的能力：

<button id="button">Hello</button> 

在這裏工作的鏈接：this jsfiddle demo

Answer 6

您可以完全解決這個問題沒有jQuery的：

<input id='button' type="button" value="BLUE" name="button_blue" /> 

的javascript：

document.getElementById('button').onclick = function(){ 
    this.value = 'red'; 
}; 

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