Trois réponses temporelles JS couramment utilisées-js tutoriel-php.cn

Trois réponses temporelles JS couramment utilisées

零到壹度

Libérer： 2018-04-03 18:00:33

original

1985 Les gens l'ont consulté

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>

Copier après la connexion

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>

Copier après la connexion

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>

Copier après la connexion

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!