Je commence à apprendre le javascript sur W3scholl. Je veux créer le bouton poussoir à partir de ce tutoriel:

<html>
<body>

<h1>My First JavaScript</h1>

<button type="button"
onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>

<p id="demo"></p>

</body>
</html> 

Je veux effacer le texte de la date après avoir à nouveau appuyé sur le bouton, comment faire?

-1
user7403445 17 janv. 2017 à 11:52

2 réponses

Meilleure réponse

Vous pouvez introduire une variable globale state et enregistrer le dernier état modifié.

Cliquez sur les appels de bouton toggle et la fonction évalue state pour l'action suivante. À la fin de la fonction state change avec le NON logique !.

function toggle() {
    if (state) { // check state
        document.getElementById('demo').innerHTML = '';
        document.getElementById('button1').innerHTML = 'Click me to display Date and Time.'
    } else {
        document.getElementById('demo').innerHTML = Date();
        document.getElementById('button1').innerHTML = 'Delete Date and Time.'
    }
    state = !state; // toggle state
}

var state; // undefined, becomes later true and false 
<button id="button1" type="button" onclick="toggle()">Click me to display Date and Time.</button>
<p id="demo"></p>
0
Nina Scholz 17 janv. 2017 à 09:14

Vous pouvez ajouter un nouveau bouton comme celui-ci:

<!DOCTYPE html>
<html>
<body>

<h1>My First JavaScript</h1>

<button type="button" onclick="document.getElementById('demo').innerHTML = Date()">
 Click me to display Date and Time.
</button>

<button type="button" onclick="Empty()">
 Click me to delete Date and Time.
</button>

<script>
function Empty(){
document.getElementById('demo').innerHTML = "";
}
</script>

<p id="demo"></p>

</body>
</html> 
0
Snackoverflow 17 janv. 2017 à 09:05