当我点击删除按钮时,它删除了所有的值。是否可以删除每个值?
我提供以下代码:
http://codepen.io/anon/pen/grRKEz?editors=1010
$('#localStorageTest').submit(function(e) {
e.preventDefault();
var email = $('#email').val();
var name = $('#name').val();
var message = $('#message').val();
var div = "<div><span>"+name+"</span><span >"+email+"</span><span>"+message+"</span><input type='button' value='Edit' name='editHistory'><input type='button' value='Delete' name='deleteHistory'></div>"; //add your data in span, p, input..
//alert(div);
$('.gettingValues').append(div); //apendd the div
$('#localStorageTest')[0].reset(); //clear the form
localStorage.clear();
});
最佳答案
由于表单将包装在 div 中的信息附加到您的“gettingValues”div,因此您只需删除父元素即可。
像这样:
$('.gettingValues').on('click', "input[name='deleteHistory']", function() {
//var div = "getting form values<input data-name='edit' type='button' value='Edit' name='editHistory'><input data-name='delete' type='button' name='deleteHistory' value='Delete'>"; //No need for this line.
console.log("Data deleted");
//$('.gettingValues').html(div); //Don't reset the html.
if($(this).parent().hasClass('gettingValues')) return false; //Don't remove the container.
$(this).parent().remove(); //Remove the containing div only.
//deleteHistoryAPI(data);
});
checkout :http://codepen.io/gborbonus/pen/grRjjy?editors=1011
关于javascript - 删除按钮删除所有值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36254776/