Jump to content
Fórum Script Brasil
  • 0
Sign in to follow this  
rxhxtx

Mudando a Classe de botão por JS

Question

Olá amigos,

estou dando uma estudada e me chegou a seguinte "barreira":

Quero montar uma função que altere a classe do botao após o usuario selecionar o checkbox

Usando o alternador entre disabled true e false esta funcionando, porem para o meu problema, não está resolvendo

 

então estava tentando juntar umas peças e cheguei a isto: (mas não funciona)


function trC(element, antigo, novo) {
    element.classList.remove(antigo);
    element.classList.add(novo);
}
function HabiDsabi(){
	if(document.getElementById('habi').checked == true){ 	 
		document.getElementById('envia').disabled=false;  
		var klas = document.getElementsByClassName('btn btn-success');
			trC(klas, 'btn btn-success', 'btn btn-success start');
		
		}  
	if(document.getElementById('habi').checked == false){ 	 
		document.getElementById('envia').disabled=true; }	}

como eu faço funcionar??

 

o habilitar e desabilitar está funcionando, 

só mudar a classe que não estou conseguindo....

 

botao:

			<form>	
				<button disabled="disabled" class="btn btn-success" name="envia" id="envia" value="Enviar" > 
					<span>botao</span>
				</button>
			<input type="checkbox" name="habi" id="habi" onClick="HabiDsabi()" >
				<span>habilita/desabilita<span>
			</form>

 

 

Resumindo:

quero transformar 

class="btn btn-success"

em

class="btn btn-success start"

quando a caixa estiver selecionada

 

 

alguém consegue me dar uma luz?

 

Share this post


Link to post
Share on other sites

1 answer to this question

Recommended Posts

  • 1

Faltou você terminar a função

function trC(element, antigo, novo) {
    element.classList.remove(antigo);
    element.classList.add(novo);
}
function HabiDsabi(){
	if(document.getElementById('habi').checked == true){ 	 
		document.getElementById('envia').disabled=false;
		var klas = document.getElementsByClassName('btn btn-success');
		trC(klas, 'btn btn-success', 'btn btn-success start');
    }  
	if(document.getElementById('habi').checked == false){ 	 
		document.getEleme ntById('envia').disabled=true;
		var klas = document.getElementsByClassName('btn btn-success start'); //---
		trC(klas, 'btn btn-success start', 'btn btn-success'); //---
    }
}

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  



  • Forum Statistics

    • Total Topics
      148417
    • Total Posts
      643832
×
×
  • Create New...