现在我完成了添加/删除元素
如何动态添加/删除元素,请查找图像附件,以便更好地理解,
从数据库类别表中填充记录的类别,当用户选择特定类别而不是子类别时,将填充数据库子类别表,
我正在寻找一个jquery或者一些打开它做同样的工作,
参考一些好的插件,
当我点击ADD Elment时如何添加元素,请在下面解释我的代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" >
$(document).ready(function(){
var hdn_add_element_cnt = $("#hdn_add_element_cnt").val();
hdn_add_element_cnt = parseInt(hdn_add_element_cnt);
var app_str = "<div id=element_"+hdn_add_element_cnt+">New Element "+hdn_add_element_cnt+" <a href=\"#\" onclick=\"delete_element("+hdn_add_element_cnt+")\">Delete</a></div>";
$('#element_area').append(app_str);
$("#add_element").click(function(){
var hdn_add_element_cnt = $("#hdn_add_element_cnt").val();
hdn_add_element_cnt = parseInt(hdn_add_element_cnt);
hdn_add_element_cnt = hdn_add_element_cnt+1;
var app_str = "<div id=element_"+hdn_add_element_cnt+">New Element "+hdn_add_element_cnt+" <a href=\"#\" onclick=\"delete_element("+hdn_add_element_cnt+")\">Delete</a></div>";
$('#element_area').fadeIn(10000).append(app_str);
//Increment Elemenet ID Count +1
document.getElementById("hdn_add_element_cnt").value = hdn_add_element_cnt;
})
})
function delete_element(element_id_no){
var get_element_hidden_cnt = $("#hdn_add_element_cnt").val();
$("#element_"+element_id_no).fadeOut(100).remove();
}
</script>
</head>
<body>
<div style="width:500px; height:200px; background-color:#FF0000;">
<div id="add_element" style="width:400px; height:75px;">
ADD Element
</div>
<div id="element_area">
</div>
</div>
<input type="hidden" id="hdn_add_element_cnt" value="1" />
</body>
</html>
答案 0 :(得分:1)
jQuery不需要插件来执行此操作。标准功能运作良好:
.append()
添加了元素,因此要向<div>
添加<body>
,请执行以下操作:
$('body').append('<div id="foobar">This is my text</div>');
.remove()
同样删除了元素,因此要删除您添加的<div>
,请执行以下操作:
$('#foobar').remove();
.html()
和.text()
可用于设置元素的内容。 .text()
通常用于设置显示的文本,.html()
用于添加内容元素:
$('#foobar').text('Hello');
$('#foobar').html('<h1 class="foo">Hello</h1>');
你的问题真的含糊不清,所以我不确定还有什么要说的。