JavaScript rencontre certains attributs de formulaire des compétences HTML5_javascript

attribut d'entrée :
espace réservé : la valeur par défaut de la zone de saisie, affichant un texte descriptif ou des informations d'invite à l'utilisateur

complétion automatique : les valeurs sont activées et désactivées. . "on" signifie que lorsque le champ est rempli et soumis puis renvoyé à la page, les informations précédemment saisies seront affichées lors d'une nouvelle saisie. off signifie fermé, y compris la sécurité des données saisies par l'utilisateur. La valeur par défaut est activée
autofocus : définir une entrée pour qu'elle obtienne automatiquement le focus lors du chargement de la page. Notez que la page ne peut définir cet attribut que pour une seule entrée. Définir plusieurs entrées équivaut à aucun paramètre.
Fonctionnalité de liste et liste de données : ajoutez une liste déroulante à une zone de saisie via une liste. . C'est équivalent à la fonction "auto-complete" implémentée dans js, mais elle ne peut pas effectuer de requêtes floues
S'il y a deux valeurs dans la liste de données : "a34343" et "24234", l'utilisateur s'attend à ce que les deux valeurs apparaissent après avoir saisi 3, mais en fait aucune d'entre elles n'apparaîtra.
Cela nécessite une correspondance complète. Par exemple, si vous entrez a, la liste déroulante a34343 apparaîtra, puis si vous entrez 4, la valeur déroulante disparaîtra.

obligatoire : Cet élément doit être renseigné avant la soumission du formulaire, c'est-à-dire qu'il ne peut pas être vide. Non recommandé en raison du message d'invite « Veuillez remplir ce champ », sauf s'il existe un attribut pouvant remplacer le message d'invite.
Modèle : un endroit pour écrire des modèles réguliers dans la balise d'entrée. . Le contrôle d'entrée dont le type est email ou url possède des expressions régulières associées intégrées. Si la valeur ne correspond pas à son expression régulière, le formulaire échouera à la vérification et ne pourra pas être soumis. .
Il n'est pas recommandé de l'utiliser pour les éléments dont le type est email ou url, car les informations d'invite sont corrigées et le modèle régulier est corrigé. . Il vaut mieux réécrire directement en js.

Quelques paramètres de saisie :
rangeUnderflow limite la valeur minimale de la commande numérique Set min, input type="number" min="0" value="20"
. rangeOverflow limite la valeur maximale de la commande numérique Set max, input type="number" max="100" value="20"
. stepMismatch garantit que la valeur d'entrée est conforme aux paramètres min, max et step. Set max min step, input type="number" min="0" max="100" step="10" value="20"<.> 4b3c96742ef1190716533dc1668c10de

Ce qui suit est une petite fonction utilisée par input=number :

function inputV(inpFields,tips){//input值范围判断。。0-100.正正数
/**
* input值范围判断。。0-100.正正数
* range 范围：使用<input type="number" min="0" max="100"/>
* if(inputV(v3,msgABC.t4)==false){return false;}
* **/
var km=inpFields[0].validity,v3=inpFields.val();
console.log('不是数字：',km.badInput,'超出范围：',km.rangeOverflow,'小于最小值：',km.rangeUnderflow);
if(km.badInput||km.rangeOverflow||km.rangeUnderflow){//a返回true 22返回true -1 返回 true
alert(tips);
return false;
}
if(isNaN(parseInt(v3))){
console.log('NaN 不判断.因为值为空');
return true;
}
else if(!!isNaN(v3)||parseInt(v3)!=parseFloat(v3)){//不是数字!!isNaN('v3')
alert(tips);
return false;
}
return true;
}

propriétés de la liste et liste de données :

<input type="url" list="url_list" name="link" />
<datalist id="url_list">
<option label="W3School" value="http://www.w3school.com.cn" />
<option label="Google" value="http://www.google.com" />
<option label="Microsoft" value="http://www.microsoft.com" />
</datalist>

<form action="http://localhost/test.php" method="post" id="register"></form>
url：<input type="url" name="url" form="register" required/><br />
user：<input type="text" name="user" value="" form="register"/><br />
pwd：<input type="password" name="pwd" value="" form="register" /><br />
<select name="year" form="register">
<option value="1970">1970</option> 
<option value="1980">1980</option> 
<option value="1990">1990</option> 
</select>
<input type="submit" value="注册" form="register"/>

Régulier : 77c360f9c68e2e9a94541bb951f65f9a

E-mail :766d829b9bea054eca7a646ba53ad6bc< ;br />

Adresse :f7c79162c0e524d73d44db095b6a86f8
DATE :e535f83b2d4da9572ad682811dbb96c4df250b2156c434f3390392d09b1c9563
TEMPS :ecce8baac87750407bd361850fbeb05a MOIS :12424f4308ab1ded8100fa3a813cca1e
Semaine :e8ce2c6addb6f4614fb6d38713f2dfca
Numéro : c91b025bc073179e52c284ef5e2f4ed5df250b2156c434f3390392d09b1c9563
Slider798d4ae7d9d52b50caa3abb416a13610
Recherche :e0eb08276351b89f6680adeb0e4142b6
Couleur :9f9cb6021db7cc3e125dff1cb7e8877cdf250b2156c434f3390392d09b1c9563
0e9f73baf0273021f27a708f9b53d388


Formulaire de remplissage automatique076402276aae5dbec7f672f8f4e5cc81

<input type="text" name="auto" value="" list="movie" />
<datalist id="movie">
<option>11111111</option>
<option>243234234</option>
<option>3324234</option>
</datalist>

Sortie du formulaire de sortie

<form action="" method="post" oninput="result.value=parseInt(no1.value*no2.value)">
<input type="number" name="no1" value=""/>
<input type="number" name="no2" value=""/>
<output name="result" ></output>
</form>

Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.