Comment interdire la saisie dans l'entrée HTML5

Comment implémenter l'interdiction de saisie dans la saisie HTML5 : 1. Spécifiez le champ de saisie en lecture seule et copiable en lecture seule ; 2. Utilisez désactivé pour réaliser que l'élément de saisie désactivé peut être copié, mais ne peut pas recevoir le focus ; contrôler la longueur maximale de l'entrée à 0 pour obtenir ; 4. Utilisez "οnfοcus="this.blur();"" pour réaliser que le texte ne peut pas être saisi.

L'environnement d'exploitation de ce tutoriel : système Windows 10, version HTML5, ordinateur DELL G3

saisie html5 Comment interdire la saisie ?

Interdiction de saisie (interdit d'obtenir le focus) méthodes multiples et limite de saisie en nombre et longueur en html

Interdiction de saisie (interdit d'obtenir le focus)

1 : lecture seule stipule que le champ de saisie est lu - uniquement et copiable, mais , l'utilisateur peut utiliser la touche Tab pour basculer vers le champ, le sélectionner, recevoir le focus et sélectionner ou copier son texte.

<input type="text" value="禁止输入，可以使用Tab键切换到该字段" readonly="readonly">

2 : désactivé L'élément de saisie désactivé peut être copié et ne peut pas recevoir le focus. Après le réglage, la couleur du texte deviendra grise. Ne peut pas être utilisé avec .

<input type="text" value="可复制，不能接收焦点，字的颜色会变成灰" disabled="disabled">

3 : Obtenu en contrôlant la longueur maximale de l'entrée sur 0

<input type="text"  maxlength="0">

4 : οnfοcus="this.blur();" onfocuse signifie focus Lorsque vous placez le curseur sur la zone de texte pour entrer, elle est focalisée. , mais "this.blur()" est ajouté ici. La fonction du flou est de supprimer le focus, c'est-à-dire que vous ne pouvez pas placer le curseur sur cette zone de texte. En d'autres termes, vous ne pouvez pas saisir de texte

<input type="text" value="去除聚焦，不能输入文本" onfocus="this.blur();">

Saisissez le numéro et. Restrictions de longueur

1.type='number' limite l'entrée aux nombres, et oninput détermine la longueur limite (il s'avère que maxlength ne peut pas être utilisé après avoir utilisé type='number')

<input class="inputs" type="number" value="只输入数字，长度11位" oninput="if(value.length>11)value=value.slice(0,11)"  />

2. Utilisez maxlength pour limiter la longueur, oninput limite la zone de saisie aux nombres purs

<input type="text" placeholder="请输入您的手机号" oninput = "value=value.replace(/[^\d]/g,&#39;&#39;)" maxlength="11">

a, onkeyup = "value=value.replace(/[^d]/g,'')"

Utilisez l'événement onkeyup, il y a un bug, c'est-à-dire dans l'état de la méthode de saisie chinoise, directement après la saisie des caractères chinois Enter, les lettres seront saisies directement

b, onchange = "value=value.replace(/[^d]/g,'')"

Utilisez le onchange événement. Après avoir saisi le contenu, cela ne se produira que lorsque l'entrée perdra le focus. Obtenez le résultat, mais vous ne pourrez pas répondre lors de la saisie

c, oninput = "value=value.replace(/[^d]/g, '')"

Utilisez l'événement oninput pour résoudre parfaitement les deux problèmes ci-dessus. Problème, aucun autre problème n'est encore apparu dans le test.

Apprentissage recommandé : "Tutoriel vidéo HTML"

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!