国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

jquery實現刪除一個元素后面的所有元素功能

2019-11-20 10:58:13
字體:
來源:轉載
供稿:網友

本文實例為大家分享了jquery實現刪除一個元素后面的所有元素功能的詳細實現過程,具體實現內容如下

實現效果:

選擇項目

點擊刪除按鈕,被選項之后的所有同級元素都被刪除

jQuery 遍歷的nextAll() 方法可以搜索 DOM 樹中的元素跟隨的同胞元素,也就是一個元素后面的所有同級元素,刪除可以使用方法remove(),所以連起來為$(selector).nextAll().remove();
下面給出實例演示:點擊按鈕后,刪除被選項目之后的所有選項
創建Html元素

<div class="box"> <span>點擊按鈕后,刪除被選項目之后的所有選項。</span><br> <div class="content"> <input type="checkbox" name="item"><span>蘿卜</span> <input type="checkbox" name="item"><span>青菜</span> <input type="checkbox" name="item"><span>小蔥</span><br> <input type="checkbox" name="item"><span>豆腐</span> <input type="checkbox" name="item"><span>土豆</span> <input type="checkbox" name="item"><span>茄子</span><br> </div>  <input type="button" value="刪除"></div>

簡單設置一下css樣式

div.box{width:300px;height:200px;padding:10px 20px;border:4px dashed #ccc;}div.box>span{color:#999;font-style:italic;}div.content{width:250px;height:100px;margin:10px 0;border:1px solid green;}input{margin:10px;}input[type='button']{width:200px;height:35px;margin:10px;border:2px solid #ebbcbe;}

編寫jquery代碼

$(function(){ $("input:button").click(function() { $("input:checkbox:checked").next().nextAll().remove(); });})

以上就是小編為大家準備的知識點,希望大家可以熟練掌握。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 镇康县| 梅州市| 海兴县| 湘潭县| 涡阳县| 苍南县| 彩票| 彰化县| 喀喇| 华容县| 门头沟区| 多伦县| 连州市| 互助| 黄梅县| 青河县| 临潭县| 米脂县| 奎屯市| 和田县| 密山市| 陈巴尔虎旗| 孝昌县| 大渡口区| 历史| 宿松县| 柘城县| 兴城市| 封开县| 石棉县| 塘沽区| 隆子县| 中阳县| 霸州市| 小金县| 嫩江县| 泌阳县| 家居| 汪清县| 宁强县| 尼木县|