Functia prezentata in aceasta pagina poate fi utilizata la dezactivarea si activarea automata a unor butoane din pagina web, cu JavaScript. Dupa ce utilizatorul apasa pe buton, e dezactivat, apoi, dupa 2 secunde butonul e activat automat.
- Aceasta functie primeste un Array cu ID-urile butoanelor la care vreti sa fie aplicat efectul.
• Codul functiei:
// functie pt activare si dezactivare butoane, primeste un Array cu ID-urile butoanelor
// de la http://www.discant.ro/javascript/
function disableEnableBtn(ids) {
// parcurge array-ul cu ID-uri
var nrids = ids.length;
for(var i=0; i<nrids; i++) {
// inregistreaza eveniment onclick la fiecare buton
if(document.getElementById(ids[i])) {
document.getElementById(ids[i]).onclick = function() {
this.setAttribute('disabled', 'disabled'); // adauga atribut "disabled", pt dezactivare, la butonul apasat
this.innerHTML = 'Dezactivat'; // schimba textul din buton
var idbtn = this.id; // retine ID-ul
// apeleaza o functie dupa 2 secunde (2000 milisecunde)
setTimeout( function() {
document.getElementById(idbtn).removeAttribute('disabled'); // sterge atribut "disabled"
document.getElementById(idbtn).innerHTML = 'Clic'; // schimba textul din buton
}, 2000 );
}
}
}
}
- Setati un Array cu ID-urile butoanelor (unul sau mai multe ID-uri), si apelati functia disableEnableBtn(), cu array-ul ca argument. Ca sa modificati timpul dupa care e activat butonul, scimbati valoarea 2000 din setTimeout(); vedeti si comentariile din cod.
- Exemplu cu doua butoane.
<button id="btn1">Click</button> - <button id="btn2">Click 2</button>
<script type="text/javascript">
// functie pt activare si dezactivare butoane, primeste un Array cu ID-urile butoanelor
// de la http://www.discant.ro/javascript/
function disableEnableBtn(ids) {
// parcurge array-ul cu ID-uri
var nrids = ids.length;
for(var i=0; i<nrids; i++) {
// inregistreaza eveniment onclick la fiecare buton
if(document.getElementById(ids[i])) {
document.getElementById(ids[i]).onclick = function() {
this.setAttribute('disabled', 'disabled'); // adauga atribut "disabled", pt dezactivare, la butonul apasat
this.innerHTML = 'Disabled'; // schimba textul din buton
var idbtn = this.id; // retine ID-ul
// apeleaza o functie dupa 2 secunde (2000 milisecunde)
setTimeout( function() {
document.getElementById(idbtn).removeAttribute('disabled'); // sterge atribut "disabled"
document.getElementById(idbtn).innerHTML = 'Click'; // schimba textul din buton
}, 2000 );
}
}
}
}
// array cu ID-urile butoanelor
var btnid = ['btn1', 'btn2'];
disableEnableBtn(btnid); // apeleaza functia
</script>