recherche

Maison >interface Web >js tutoriel >jQuery ajoute un nouvel élément à la liste dynamique

jQuery ajoute un nouvel élément à la liste dynamique

php中世界最好的语言
php中世界最好的语言original
2018-03-15 13:50:582373parcourir

Cette fois, je vais vous apporter jQuery pour ajouter de nouveaux éléments à la liste dynamique. Quelles sont les précautions pour ajouter de nouveaux éléments à la liste dynamique avec jQuery. cas pratique. Jetons un coup d'oeil une fois.

Regardez d'abord les rendus :

Le code d'implémentation complet est le suivant : 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery列表添加新元素</title>
<script src="jquery-1.7.2.min.js"></script>
</head>
<body>
<h3>li列表：</h3>
<ol>
    <li>jb51</li>
    <li>php</li>
    <li>javascript</li>
    <li>HTML5</li>
</ol>
<input type="text" id="text">
<input type="button" id="btn" value="添加">
<script type="text/javascript">
 $(function () {
    $('#btn').click(function () {
      $('ol').append('<li>'+$('#text').val()+'</li>');
    });
});
</script>
</body>
</html>

Je crois que vous le maîtrisez après avoir lu le cas dans cet article Méthode, pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Service client en ligne pratique de type tiroir jQuery

Explication détaillée de l'utilisation du plug-in de visualisation d'images Magnify

JS réalise la fusion des mêmes cellules dans le tableau

Comment jQuery+ajax réalise la pagination dynamique des données

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：Service client en ligne pratique de style tiroir jQueryArticle suivant：Service client en ligne pratique de style tiroir jQuery

Articles Liés

Voir plus