Maison > Article > interface Web > Comment ajouter une ligne en cliquant sous forme jquery

Comment ajouter une ligne en cliquant sous forme jquery

青灯夜游original: 2022-03-25 18:52:393234parcourir

Comment ajouter une ligne en cliquant sur le formulaire : 1. Utilisez la fonction click() pour lier l'événement click à l'élément du formulaire et définir la fonction de traitement d'événement, 2. Dans la fonction de traitement d'événement, utilisez append() ; fonction pour ajouter une ligne de contrôles au formulaire, la syntaxe est "$(this).append("Form input control element");".

L'environnement d'exploitation de ce tutoriel : système Windows 7, jquery version 1.10.2, ordinateur Dell G3.

Implémentation du formulaire jquery en cliquant pour ajouter une ligne

Méthode d'implémentation :

Utilisez la fonction click() pour lier l'événement click à l'élément de formulaire et définir la fonction de traitement d'événement
Dans la fonction de traitement d'événements, utilisez la fonction append() pour ajouter une ligne au formulaire

Code d'implémentation :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-1.10.2.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("form").click(function() {
					$(this).append("<br>其　他: <input>");
				});
			});
		</script>
	</head>
	<body>
		<form style="border: 1px solid red;padding: 10px;">
		用户名: <input type="text" name="name"><br>
		密　码: <input type=&#39;password&#39; name=&#39;password&#39;>
		</form>
		<p>点击表单，增加一行数据</p>
	</body>
</html>

Comment ajouter une ligne en cliquant sous forme jquery

Description : La méthode

append( ) peut insérer du contenu dans le " end" à l'intérieur de l'élément sélectionné.

Syntaxe :

$(A).append(B)

signifie insérer B à la fin de A.

【Apprentissage recommandé : Tutoriel vidéo jQuery, Vidéo web front-end】

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!

jquery append 事件 this

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：Comment supprimer les événements de souris dans jqueryArticle suivant：Comment supprimer les événements de souris dans jquery

Articles Liés

Voir plus