0
我想使用jQuery來動態添加和刪除頁面的HTML部分。我使用Clone()和insertAfter()添加代碼。我嘗試使用remove()單擊鏈接時刪除部分html（x=delete），但在識別應刪除的部分時遇到問題。jquery動態添加/刪除代碼段
<script src="jquery/jquery.js"></script>
<body>
<div id="thisIsJustAPlaceHolder"></div>
<div id="thisIstheTemplate" class='blueBox'>
A text box:
<input id="preName1" type="text" name="txt_first"/>
<span class='deleteBox'><a href="#" class='deleteBox'>X</a></span><br/>
Radio Box
<input id="preRadio1" type="radio" name="rb_option1" value="option1" /> Option 1
<input id="preRadio1" type="radio" name="rb_option1" value="option2" /> Option 2
<br/>
<input type="hidden" id="prehidden1" value="dummy" name="txt_last" /><br/>
</div>
<div class="thisIsJustAPlaceHolder"></div>
<br/>
<input id="Submit" type="submit" value="I need another box please" />
<script>
$(document).ready(function() {
// append a new box
$('#Submit').click(function() {
$('#thisIstheTemplate').clone()
.removeAttr("id")
.addClass("myClass")
.insertAfter($('#thisIsJustAPlaceHolder'));
return false;
});
// delete box when X is clicked
$('.deleteBox').click(function() {
// alert($(this).parent().get("class"));
// some code here...
return false;
});
});
</script>
<style>
.blueBox{
border: 1px solid blue;
width: 400px;
padding: 20px;
margin: 10px;
}
a.deleteBox{
float:right;
}
</style>
你的問題不是很清楚。 –