如果我在屏幕上有3个按钮,当单击每个按钮时,它会加载带有删除按钮的注释。有时,我面临删除按钮删除所有3个图像的问题,而不是仅删除该特定图像。有什么想法吗?我更新了代码,每个代码都有不同的“输入#” 但我仍然遇到了这个问题。
$("#addnote3").click(function() {
if($("#theImgb").length == 0){
var txt_box2='<div id="input3" style="display:block"; ><a href=""><img id="theImgb" width="120px;" src="http://www.clker.com/cliparts/W/7/9/Z/g/3/blue-red-sticky-note-md.png"/><img src="http://www.pedagogic.com/services/Pics/delete_button_small.gif" class="removec"/></div>';
$(".panel1").append($(txt_box2).clone());
$('.panel1').on("click", ".removec", function() {
$(".alert").show();
$(this).parent().slideUp('medium',function(e){
$("#input3").remove().empty();
$(this).remove();
store();
$('[input3]').each(function () {
var ids = $('[input3="' + this.id + '"]');
// remove duplicate IDs
if (ids.length > 1 && ids[0] == this) $('#' + this.id).remove();
});
});
});
store();
}
});
$("#addnote4").click(function() {
$(".alert").show();
if($("#theImgb").length == 0){
var txt_box2='<div id="input3" style="display:block"; ><a href=""><img id="theImgc" width="120px;" src="http://www.clker.com/cliparts/W/7/9/Z/g/3/blue-red-sticky-note-md.png"/><img src="http://www.pedagogic.com/services/Pics/delete_button_small.gif" class="removec"/></div>';
$(".panel1").append($(txt_box2).clone());
$('.panel1').on("click", ".removec", function() {
$(".alert").show();
$(this).parent().slideUp('medium',function(e){
$("#input4").remove().empty();
$(this).remove();
store();
$('[input4]').each(function () {
var ids = $('[input4="' + this.id + '"]');
// remove duplicate IDs
if (ids.length > 1 && ids[0] == this) $('#' + this.id).remove();
});
});
});
store();
}
});
$("#addnote5").click(function() {
$(".alert").show();
if($("#theImgb").length == 0){
var txt_box2='<div id="input5" style="display:block"; ><a href=""><img id="theImgc" width="120px;" src="http://www.clker.com/cliparts/W/7/9/Z/g/3/blue-red-sticky-note-md.png"/><img src="http://www.pedagogic.com/services/Pics/delete_button_small.gif" class="removec"/></div>';
$(".panel1").append($(txt_box2).clone());
$('.panel1').on("click", ".removec", function() {
$(".alert").show();
$(this).parent().slideUp('medium',function(e){
$("#input5").remove().empty();
$(this).remove();
store();
$('[input5]').each(function () {
var ids = $('[input5="' + this.id + '"]');
// remove duplicate IDs
if (ids.length > 1 && ids[0] == this) $('#' + this.id).remove();
});
});
});
store();
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<button id="addnote3">Add</button>
<button id="addnote4">Add</button>
<button id="addnote5">Add</button>
<div class="panel1"></div>
我将这些注释附加到DOM。注释(addNote 3和addNote4)具有附加的删除按钮。好吧,我在那里添加了代码,它将删除已经附加的那个注释,但问题是它有时会删除所有内容。 (注意它的代码将删除重复的ID。我在这个代码中添加了因为在dom中,但没有在视觉上创建额外的ID,但在视觉上,所以我找到了删除它们的代码。)。任何帮助都会很棒!
$("#addnote3").click(function () {
$(".alert").show();
if ($("#theImgb").length == 0) {
var txt_box2 = '<div id="input3" style="display:block"; ><a href=""><img id="theImgb" width="120px;" src="assets/img/bluesticky3.png"/><img src="assets/img/remove.png" class="removec"/></div>';
$(".panel1").append($(txt_box2).clone());
$('.panel1').on("click", ".removec", function () {
$(".alert").show();
$(this).parent().slideUp('medium', function (e) {
$("#input3").remove().empty();
$(this).remove();
store();
$('[input3]').each(function () {
var ids = $('[input3="' + this.id + '"]');
// remove duplicate IDs
if (ids.length > 1 && ids[0] == this) $('#' + this.id).remove();
});
});
});
store();
}
});
$("#addnote4").click(function () {
$(".alert").show();
if ($("#theImgb").length == 0) {
var txt_box2 = '<div id="input3" style="display:block"; ><a href=""><img id="theImgc" width="120px;" src="assets/img/bluesticky4.png"/><img src="assets/img/remove.png" class="removec"/></div>';
$(".panel1").append($(txt_box2).clone());
$('.panel1').on("click", ".removec", function () {
$(".alert").show();
$(this).parent().slideUp('medium', function (e) {
$("#input3").remove().empty();
$(this).remove();
store();
$('[input3]').each(function () {
var ids = $('[input3="' + this.id + '"]');
// remove duplicate IDs
if (ids.length > 1 && ids[0] == this) $('#' + this.id).remove();
});
});
});
store();
}
});