這次帶給大家jQuery的prev()使用詳解,jQuery的prev()使用注意事項有哪些,下面就是實戰案例,一起來看一下。
prev() 函數被用來匹配元素集的前一個兄弟元素,僅僅只有前一個兄弟元素被選擇,其子元素將被忽略。這裡跟大家介紹jQuery裡prev()的簡單操作,具體內容如下:
有個朋友提了個需求給我:點選按鈕刪除input,如果input剩下一個,點選按鈕全部消失。
很簡單的操作,但你如果不知道jquery裡面有prev()這個方法,可能你會走很多彎路。
<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>
這裡我混合寫的,不規範,只做一個栗子,重在理解。
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
以上是jQuery的prev()使用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!