关于jQuery里prev()的简单操作代码分享


prev() 函数被用来匹配元素集的前一个兄弟元素,仅仅只有前一个兄弟元素被选择,其子元素将被忽略。这里给大家介绍jQuery里prev()的简单操作,具体内容如下:

一个朋友提了个需求给我:点击按钮删除input,如果input剩一个,点击按钮全部消失。

很简单的操作,但是你如果不知道jquery里有prev()这个方法,可能你会走很多弯路。

代码:

html

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

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>

这里我混合写的,不规范,只做一个栗子,重在理解。

www.dengb.comtruehttps://www.dengb.com/jQuery/1264733.htmlTechArticle关于jQuery里prev()的简单操作代码 prev() 函数被用来匹配元素集的前一个兄弟元素,仅仅只有前一个兄弟元素被选择,其子元素将被忽略。这…

—-想了解更多的jQuery特效教程关注<计算机技术网(www.ctvol.com)!!>

本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

ctvol管理联系方式QQ:251552304

本文章地址:https://www.ctvol.com/jquerytutorial/102089.html

(0)
上一篇 2020年4月27日
下一篇 2020年4月27日

精彩推荐