如何在刷新HTML页面后清除Django模板变量内容

这个问题的核心是你没有遵循Post/Redirect/Get (PRG)设计模式——当用户通过POST提交数据后，你直接返回了渲染后的页面，浏览器刷新时会重新发送之前的POST请求，同时模板里的text变量还保留着上次提交的值，所以页面会重复显示旧内容。下面是两种可靠的解决方法，优先推荐后端PRG方案：

方法一：使用PRG模式（后端标准解决方案） #

PRG是处理表单提交的最佳实践，它能避免刷新重复提交，同时自然清除页面上的旧数据。具体步骤：

1. 修改views.py中的basic_work视图，处理完POST请求后重定向回GET请求的视图，而不是直接render：

from django.shortcuts import render, redirect
from django.contrib import messages

def basic_work(request):
    # 不推荐用全局变量存储数据，建议用session或messages传递结果
    if request.method == 'POST':
        text = request.POST.get('text')
        if text:
            text_count = len(text.split(' '))
            if text_count > 1000:
                messages.info(request, 'Please try with word count less than 1000')
                # 重定向回当前页面，触发GET请求清空表单数据
                return redirect('basic_work')  # 确保urls.py中该视图的name为basic_work
            # 这里写入你的word_count处理逻辑
            messages.success(request, f'Word count: {text_count}')
            # 重定向到GET请求页面，彻底避免刷新重复提交
            return redirect('basic_work')
    # GET请求时，渲染空表单页面
    return render(request, 'index.html')

2. 调整index.html模板，从messages框架获取提示信息，不再直接渲染text变量：

{% csrf_token %}
{% if messages %}
    {% for message in messages %}
        <div class="{{ message.tags }}">{{ message }}</div>
    {% endfor %}
{% endif %}
<!-- 你的文本输入框 -->
<textarea name="text"></textarea>

这样处理后，用户提交数据后会被重定向到GET请求的页面，刷新时只会发送GET请求，表单内容自动清空，同时你可以通过messages传递处理结果。

方法二：前端JavaScript辅助（快速临时方案） #

如果你暂时不想修改后端逻辑，可以在页面加载时用JS清空文本框，但这只是前端层面的处理，无法避免刷新时浏览器提示重新提交表单的问题：

{% csrf_token %}
{% if text %}{{text}}{% endif %}
<textarea name="text" id="input-text"></textarea>

<script>
// 页面加载完成后立即清空文本框
window.addEventListener('load', function() {
    document.getElementById('input-text').value = '';
});
</script>

⚠️ 注意：这种方法仅清空输入框，无法解决重复提交的本质问题，所以更推荐PRG模式。

内容的提问来源于stack exchange，提问作者Dmitri