Maison > Article > interface Web > Trois réponses temporelles JS couramment utilisées

Trois réponses temporelles JS couramment utilisées

零到壹度original: 2018-04-03 18:00:331977parcourir

Cet article présente principalement trois réponses temporelles JS couramment utilisées. L'éditeur pense qu'il est assez bon, je vais donc le partager avec vous maintenant et le donner comme référence. Suivons l'éditeur et jetons un coup d'œil

Voici quelques réponses temporelles couramment utilisées, simples à utiliser et très efficaces.

1. Déclencheur d'appui sur une touche

Ce type de réponse événementielle est très courant, et on le rencontre également dès le début. Pour donner un exemple simple :

<!DOCTYPE html>  
<html>  
<head>  
<title>javascript</title>  
</head>  
<body>  
    <p>点击确认查看日期</p>  
    <button onclick="myFunction()">确认</button>  
    <p id="demo"></p>  
    <script>  
    function myFunction() {  
        document.getElementById("demo").innerHTML =Date();  
}  
</script>  
</body>

Le cœur de ce type de méthode est d'ajouter onclick+nom de la fonction à l'étiquette du bouton pour déclencher la fonction.

2. Déclenchez la souris ou entrez le déclencheur.

Les défauts de la première méthode sont en réalité très évidents. Par exemple, si je souhaite traiter un lot de données et qu’il existe de nombreuses zones de saisie, dois-je ajouter une clé de confirmation après chaque zone ? Ceci est très déraisonnable pour la saisie de l'utilisateur, il sera donc beaucoup plus efficace d'utiliser la souris ou la touche Entrée pour déclencher l'effet lors du remplissage d'un formulaire ou de plusieurs zones de saisie.

<!DOCTYPE html>  
<html>  
<head>  
<title>javascript</title>  
</head>  
<body>  
    <p>请输入下列表框</p>  
	<label>表框一</label><input type="text" id="t1" onchange="myFunction()"/>  
    <p id="demo1"></p>  
    <script>  
    function myFunction() {  
        var x = document.getElementById("t1").value;
		document.getElementById("demo1").innerHTML="表格一的内容是"+x;
}  
</script>  
</body>

Le noyau est d'utiliser onchange pour appeler la fonction dans la zone de saisie. Après avoir rempli, la fonction sera appelée en cliquant n'importe où avec la souris ou en appuyant sur Entrée. Différents effets apparaîtront selon différents. traitement.

3. Déclenchez à tout moment

Cette utilisation est encore meilleure Pour des exemples concrets, vous pouvez essayer la conversion hexadécimale en ligne sur la page Web, qui fait. ne vous oblige pas à appuyer sur la touche de confirmation, vous pouvez le saisir à tout moment et le convertir à tout moment. Y compris la calculatrice du téléphone mobile, il calcule la valeur d'entrée en temps réel.

<!DOCTYPE html>  
<html>  
<head>  
<title>javascript</title>  
</head>  
<body>  
    <p>请输入下列表框</p>  
	<label>表框一</label><input type="text" id="t1" onKeyUp="myFunction()"/>  
    <p id="demo1"></p>  
    <script>  
    function myFunction() {  
        var x = document.getElementById("t1").value;
		document.getElementById("demo1").innerHTML="表格一的内容是"+x;
}  
</script>  
</body>

Le cœur de la méthode d'utilisation est oneKeyUp + nom de la méthode. En plus de cela, il existe également des mots-clés onkeypress, oneKeyDown, etc. Personnellement, je pense que oneKeyUp est plus pratique.

Recommandations associées :

Répartition et analyse approfondie du temps de réponse des transactions Web

Effets de chronologie jQuery basés sur la réponse verticale Bootstrap

10 façons de rendre votre application Node.js plus rapide Conseils

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：encapsulation de fonction jsArticle suivant：encapsulation de fonction js

Articles Liés

Voir plus