jQuery動(dòng)態(tài)添加、刪除元素的方法
更新時(shí)間：2014年01月09日 15:44:56 作者：
添加、刪除元素在項(xiàng)目中經(jīng)常會(huì)用到，下面為大家介紹下使用jQuery對(duì)元素進(jìn)行動(dòng)態(tài)添加和刪除，具體的實(shí)現(xiàn)如下，希望對(duì)大家有所幫助
復(fù)制代碼 代碼如下:
<script>
$.schoolFn = {
addItem: function(obj){
$("#itemList").append("<li id='liItrm' class='list-group-item clearfix'><span class='glyphicon glyphicon-resize-vertical sort-handle'></span>"+obj+"<input type='hidden' name='audiences' value='"+obj+"'><button type='button' class='close delete-btn deleteItem' onclick='deleteItem(this);' title='刪除'>×</button></li>");
},
removeItem: function(obj){
$("#"+obj).replaceWith("");
}
}
$("#itemAdd").click(function(){
var item=$('#teacherInput').val();
$.schoolFn.addItem(item);
$('#teacherInput').val("");
});
function deleteItem(obj){
var item=$(obj).parents(".list-group-item").attr("id");
$.schoolFn.removeItem(item);
}
</script>
您可能感興趣的文章:
- 基于jquery實(shí)現(xiàn)的鼠標(biāo)拖拽元素復(fù)制并寫入效果
- Jquery UI實(shí)現(xiàn)一次拖拽多個(gè)選中的元素操作
- jquery插件jquery.dragscale.js實(shí)現(xiàn)拖拽改變?cè)卮笮〉姆椒?附demo源碼下載)
- jquery網(wǎng)頁(yè)元素拖拽插件效果及實(shí)現(xiàn)
- jQuery 版元素拖拽原型代碼
- JQuery拖拽元素改變大小尺寸實(shí)現(xiàn)代碼
- jQuery如何獲取動(dòng)態(tài)添加的元素
- Jquery顯示、隱藏元素以及添加刪除樣式
- Jquery動(dòng)態(tài)添加及刪除頁(yè)面節(jié)點(diǎn)元素示例代碼
- jquery實(shí)現(xiàn)拖拽添加元素功能
相關(guān)文章
反選想必大家都有一個(gè)比較獨(dú)特的方法吧，下面與大家分享下利用jquery實(shí)現(xiàn)高效反選，具體代碼如下感興趣的朋友可以參考下哈2013-05-05
將jquery.qqFace.js表情轉(zhuǎn)換成微信的字符碼
這篇文章主要介紹了將jquery.qqFace.js表情轉(zhuǎn)換成微信的字符碼的方法，以及jquery.qqface.js的使用方法，需要的朋友可以參考下2017-12-12
jquery+CSS3實(shí)現(xiàn)3D拖拽相冊(cè)效果
這篇文章主要為大家詳細(xì)介紹了jquery+CSS3實(shí)現(xiàn)3D拖拽相冊(cè)效果的具體代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-07-07
jQuery實(shí)現(xiàn)input輸入框獲取焦點(diǎn)與失去焦點(diǎn)時(shí)提示的消失與顯示功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)input輸入框獲取焦點(diǎn)與失去焦點(diǎn)時(shí)提示的消失與顯示功能,涉及jQuery事件響應(yīng)及頁(yè)面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-05-05
這篇文章主要介紹了jQuery Form表單取值的方法，之前js取form表單的值都是一個(gè)一個(gè)的取，數(shù)量一多之后容易出錯(cuò)而且煩透了。具體jq form表單取值方法，大家通過本文學(xué)習(xí)下吧2017-01-01
JQuery彈出炫麗對(duì)話框的同時(shí)讓背景變灰色
這篇文章主要介紹JQuery實(shí)現(xiàn)彈出炫麗對(duì)話框的同時(shí)讓背景變灰色效果,需要的朋友可以參考下2014-05-05
使用jquery給新生的th綁定hover事件的實(shí)例
下面小編就為大家?guī)硪黄褂胘query給新生的th綁定hover事件的實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-02-02
jquery實(shí)現(xiàn)人性化的有選擇性禁用鼠標(biāo)右鍵
與其使用比較暴力的手段禁用鼠標(biāo)右鍵，還不如有選擇性人性化的的禁用鼠標(biāo)右鍵,需要的朋友可以參考下2014-06-06
jQuery實(shí)現(xiàn)點(diǎn)擊該行即可刪除HTML表格行
本節(jié)任務(wù)是從一個(gè)HTML表使用一些時(shí)髦的效果，只要按一下該行的行。以下是實(shí)現(xiàn)這一目標(biāo)的jQuery代碼2014-10-10
jquery插件uploadify多圖上傳功能實(shí)現(xiàn)代碼
這篇文章主要為大家詳細(xì)介紹了jquery插件uploadify多圖上傳功能實(shí)現(xiàn)代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-08-08