Maison >interface Web >js tutoriel >Explication détaillée de l'utilisation de prev() par jQuery

Explication détaillée de l'utilisation de prev() par jQuery

php中世界最好的语言
php中世界最好的语言original
2018-04-19 14:21:514065parcourir

Cette fois, je vais vous apporter une explication détaillée de l'utilisation de prev() de jQuery Quelles sont les précautions lors de l'utilisation de prev() de jQuery Voici un cas pratique, prenons un. regarder. La fonction

prev() est utilisée pour faire correspondre l'élément frère précédent de l'ensemble d'éléments. Seul l'élément frère précédent est sélectionné et ses éléments enfants seront ignorés. Ici, je vais vous présenter le fonctionnement simple de prev() dans jQuery. Le contenu spécifique est le suivant :

. Un ami m'a fait une demande : cliquez sur le bouton pour supprimer l'entrée. S'il ne reste qu'une seule entrée, cliquez sur le bouton pour supprimer toutes les entrées.

C'est une opération très simple, mais si vous ne savez pas qu'il existe une méthode prev() dans jquery, vous risquez de faire de nombreux détours.

<p>
  <input type="text" placeholder="用户名">
  <input type="text" placeholder="用户名">
  <input type="text" type="hidden">
  <input type="text" type="hidden">
  <a class="reduce" onclick="less()">—</a>
 </p>

css

.reduce{
   display: inline-block;
   color: white;
   text-align: center;
   width: 30px;
   height: 30px;
   background: red;
   line-height: 30px;
   cursor: pointer;
  }
  input{
   height: 18px;
   padding: 5px 10px;
  }

JS

<script src="jquery-1.7.2.min.js"></script>
<script>
 var Reduce = document.getElementsByClassName("reduce");
 var Inp = document.getElementsByTagName("input");
 function less(){
    //查找元素的上一个元素 并移除
  $(".reduce").prev().remove();
  if(Inp.length < 1){
   $(".reduce").remove()
  }
 }
 $(".reduce")
</script>

Ce que j'ai écrit ici est mixte et hors standard, juste une châtaigne, l'accent est mis sur la compréhension.

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

Lecture recommandée :



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