您好,欢迎来到刀刀网。
搜索
您的当前位置:首页关于jQuery里prev()的简单操作实例详解

关于jQuery里prev()的简单操作实例详解

来源:刀刀网


本文主要介绍了jQuery里prev()的简单操作代码,非常不错,具有参考借鉴价值,需要的朋友可以参考下,希望能帮助到大家。

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

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

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

代码:

html

<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>

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

Copyright © 2019- gamedaodao.com 版权所有 湘ICP备2022005869号-6

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务