提交后清除 textarea 字段中的值

Posted 2023-03-05

【中文标题】提交后清除 textarea 字段中的值

【英文标题】：Clean value in textarea field after submission

【发布时间】：2016-04-14 01:43:33

【问题描述】：

我的表单带有这样的 textarea 字段：

<form action="post.php" method="post" accept-charset="utf-8" id="myForm">
<textarea name="content" rows="10" cols="60"></textarea>
<input name="submit" type="submit" value="submit" />
</form>

我执行查询以将值插入到表中，如下所示：

$q = "INSERT INTO tableName (x, y, x) VALUES (1, a, b)";
        $r = $mysqli->query($q);
        if ($mysqli->affected_rows == 1) 
            echo '<p>Your post has been entered.</p>';

         else 
            echo '<p>Your post could not be handled due to a system error.</p>';
        

假设表单提交成功，消息返回your post has been entered。

如果使用表单提交值的用户在此之后立即离开页面immediately，那就没什么好说的了。但是，问题在于，如果他/她重新加载当前页面（通过刷新浏览器） 以一遍又一遍地提交，相同 值会插入到表中, `我不想这样'。

你能帮我清除textarea字段的值，这样就不能重新提交表单（由于表单验证），使用php？

谢谢

【问题讨论】：

一个众所周知的问题策略是将表单发布到重定向处理程序。这样您在重新加载结果/成功页面时就不会重新提交表单。

那么，你能告诉我将它重定向到 newly-inserted 项的代码吗？假设表中的newly-inserted 项目具有项目ID、主题和正文。请注意，我知道如何重定向到项目页面，但不知道如何重定向到新项目链接。谢谢

【参考方案1】：

只需在你的 js 文件中添加以下内容

$("form :input").attr("autocomplete", "off");

或如下更改表单标签

 <form action="post.php" method="post" accept-charset="utf-8" id="myForm" autocomplete="off">

【讨论】：

autocomplete = "off" 并非在所有浏览器中都能始终如一地工作！。实际上，我已经在我的 FF 版本 43.0.4 中尝试过，但失败了！

【参考方案2】：

将页面重定向到任何地方 在点击您的查询后

使用：

$q = "INSERT INTO tableName (x, y, x) VALUES (1, a, b";
    $r = $mysqli->query($q);
    if ($mysqli->affected_rows == 1) 
        header('location:note/form');
        echo '<p>Your post has been entered.</p>';
     else 
        echo '<p>Your post could not be handled due to a system error.</p>';
    

将标题位置更改为要重定向的页面。

重定向到另一个页面会改变URL，数据不会保留在缓存中，之后不能提交相同的记录。

享受吧！

【讨论】：

好主意，但是您知道如何重定向到刚刚插入数据库的特定新添加项目，例如http://domain.com/details.php?id=2（数字2是项目ID），而不是新页面，例如index.php 左右？

如果您打开链接的 id 将由查询生成。然后$last_id=mysql_insert_id(); if 会给你保存的id。并将其附加到header('location:details.php?id='.$last_id);

的链接

【参考方案3】：

<form action="post.php" method="post" accept-charset="utf-8" id="myForm" autocomplete="off">
        <textarea name="content" rows="10" cols="60"></textarea>
        <input name="submit" type="submit" value="submit" />
</form>

请参考此 URL 以禁用表单自动完成功能： http://www.w3schools.com/tags/att_input_autocomplete.asp

【讨论】：

Phong对你有帮助吗？

Yaxita shah 也建议这样做。对我来说没有成功！

【参考方案4】：

提交到数据库后清除所有表单字段：

document.forms['form_name'].reset()

【讨论】：

我已经尝试过了，但失败，因为表单的输入类型是'submit'，而不是button。参考：w3schools.com/jsref/tryit.asp?filename=tryjsref_form_reset

【参考方案5】：

所以它保持相同值的原因是因为浏览器缓存表单输入以帮助不小心离开页面的用户。 （例如：点击“返回”按钮）

您可以使用 venkatKA 建议的 javascript/jQuery 方法，但我建议在您的页面头部添加：

<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="-1">

正如How to prevent browser from caching form fields?中所建议的那样

【讨论】：

刚刚尝试按照建议添加meta 标签，但也失败了。