显示提交的值

时间:2016-03-27 13:57:29

标签: javascript jquery html css reactjs

我正在尝试更新我在表单中输入的表单值以显示为列表。我正在尝试获取表单值并使用本地存储显示值,但我不确定如何在div标记中显示输入的值gettingValues

你能告诉我怎么做吗?我在下面提供我的代码。我也把它放在Codepen中:http://codepen.io/anon/pen/PNjQRQ?editors=1010

<div class="gettingValues"> getting form values
    <input data-name="edit" type="button" value="Edit" name="editHistory">
    <input data-name="delete" type="button" name="deleteHistory" value="Delete">
</div>

1 个答案:

答案 0 :(得分:0)

您应该在表单中获取提交的值:

$('#localStorageTest').submit(function() {
    localStorage.clear();
  });

更改为:

$('#localStorageTest').submit(function(e) {
    e.preventDefault();
    var div = "<div><span>"+$('#name').val()+"</span><span>"+$('#email').val()+"</span></div>";  //add your data in span, p, input.. 
    $('.gettingValues').append(div); //apendd the div
    $('#localStorageTest')[0].reset(); //clear the form 
    localStorage.clear();
 });

但是,如果您想要单击“编辑”或“删除”按钮并触发某些功能,则必须附加绑定功能并设置“id”或唯一标识符以了解哪个用户编辑/删除。

如果您还要存储提交的用户,可以添加$.get / $.post功能。

希望它有所帮助!