本文主要介绍了jQuery里prev()的简单操作代码,非常不错,具有参考借鉴价值,需要的朋友可以参考下,希望能帮助到大家。
prev() 函数被用来匹配元素集的前一个兄弟元素,仅仅只有前一个兄弟元素被选择,其子元素将被忽略。这里给大家介绍jQuery里prev()的简单操作,具体内容如下:
一个朋友提了个需求给我:点击按钮删除input,如果input剩一个,点击按钮全部消失。
很简单的操作,但是你如果不知道jquery里有prev()这个方法,可能你会走很多弯路。
代码:
html
1 2 3 4 5 6 7 | <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>
|
Salin selepas log masuk
css
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | .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;
}
|
Salin selepas log masuk
JS
1 2 3 4 5 6 7 8 9 10 11 12 13 | <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>
|
Salin selepas log masuk
这里我混合写的,不规范,只做一个栗子,重在理解。
相关推荐:
jQuery中prev()方法用法实例
关于prev()的10篇文章推荐
有关php prev()函数的文章推荐10篇
Atas ialah kandungan terperinci 关于jQuery里prev()的简单操作实例详解. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!