我如何才能获得隐藏/取消隐藏按钮来同时发送帖子请求

How can I get a hide/unhide button to also sends post request?

本文关键字：隐藏 请求 按钮 取消      更新时间：2023-09-26

我有一段代码，允许通过单击按钮时隐藏/显示的输入来编辑字段。它工作正常，但只在本地更改页面上的数据（不会更新我的数据库。这意味着当用户编辑他们的配置文件时，它会保存在数据库中）。我知道如何使用jquery在不刷新的情况下提交表单，但我不知道如何将两者结合起来，以便有人可以编辑字段（原位），然后当他们点击完成时，它会在不刷新（如facebook）的情况下进行提交。

问题是使用"编辑"按钮（只是一个锚点）下面的代码将其转换为"保存"按钮，然后返回为"编辑"。我想让我提交字段，我需要一个提交按钮吗？

这是我用来进行就地编辑的代码：

$('#editvalue').click(function(e){$('#storedvalue').hide();$('#altervalue').show();});
$('#savevalue').click(function(e){
   var showNew = $('#changevalue').val();
   $('#altervalue').hide();
   $('#storedvalue').show();
   $('#storedvalue span').text(showNew);
});

我从这里的教程中学会了如何在不刷新的情况下提交表格。我不确定如何将它们结合起来以达到我想要的效果，但我不确定这是否是解决问题的正确方法。有没有一种方法可以将showNew变量作为帖子提交，而无需用户单击提交按钮（可能在用户单击保存时触发）？

我是jquery和web编程的新手，如果我没有正确解释这一点，我很抱歉。如果有帮助的话，这里是与上面的js代码一起工作的html：PHP jQuery示例：

<div id="wrapper">
   <div id="container">
      <div id="storedvalue"><span>Hello</span> [<a href="javascript:void(0);" id="editvalue">edit</a>]</div>
      <div id="altervalue" style="display:none;"><input type="text" name="changevalue" id="changevalue" value="Hello"> [<a href="javascript:void(0);" id="savevalue">save</a>]</div>
   </div>
</div>

如果我理解正确，只需按照http://api.jquery.com/jQuery.post/在$（"#savevalue"）中。单击（function（e）｛…｝）`函数。像这样的东西：

$('#editvalue').click(function(e){$('#storedvalue').hide();$('#altervalue').show();});
$('#savevalue').click(function(e){
    var showNew = $('#changevalue').val();
    $('#altervalue').hide();
    $.post("test.php", { val: showNew } );
    $('#storedvalue').show();
    $('#storedvalue span').text(showNew);
});

这将把单个字段发布到test.php页面。你也可以（也应该）添加成功/失败回调，看看一切是否如预期。

当然，这个值必须在PHP端进行处理

EDIT：具有更多通用代码的示例，包括在http://jsfiddle.net/X8Rsg/4/

相关文章：