如何在Django表单的输入框后添加文本？

你需要实现输入框后直接追加单位文本（如USD）的效果，不想通过模板判断字段名，且默认help_text的换行不符合需求，以下是几种可行方案：

1. 自定义Widget（推荐） #

继承Django内置的NumberInput，重写渲染方法，在输入框HTML后拼接单位文本：

from django.forms.widgets import NumberInput

class NumberWithUnitWidget(NumberInput):
    def __init__(self, unit, attrs=None):
        self.unit = unit
        super().__init__(attrs)

    def render(self, name, value, attrs=None, renderer=None):
        input_html = super().render(name, value, attrs, renderer)
        # 可调整margin值控制单位与输入框的间距
        return f'{input_html}<span style="margin-left: 4px;">{self.unit}</span>'

在表单中使用该Widget：

from django import forms

class PriceForm(forms.Form):
    price = forms.DecimalField(
        label='Price',
        widget=NumberWithUnitWidget(unit='USD')
    )

渲染后HTML会自动在输入框后追加单位文本，无额外换行。

2. 用CSS修正help_text显示 #

若不想修改Python代码，可通过CSS将默认块级显示的help_text改为行内：

/* 可根据实际表单类名调整选择器 */
.form-group .helptext {
    display: inline;
    margin-left: 4px;
    /* 可选：调整样式与输入框对齐 */
    vertical-align: middle;
}

表单中设置help_text：

class PriceForm(forms.Form):
    price = forms.DecimalField(
        label='Price',
        help_text='USD'
    )

此方案无需修改后端逻辑，仅通过样式实现同效果。

3. 自定义Widget模板片段 #

通过自定义模板片段实现更灵活的渲染：

1. 创建模板文件templates/widgets/number_with_unit.html：

{% include "django/forms/widgets/input.html" %}
<span style="margin-left: 4px;">{{ widget.attrs.unit }}</span>

2. 定义Widget并指定模板：

from django.forms.widgets import NumberInput

class NumberWithUnitWidget(NumberInput):
    template_name = 'widgets/number_with_unit.html'

    def __init__(self, unit, attrs=None):
        attrs = attrs or {}
        attrs['unit'] = unit
        super().__init__(attrs)

3. 表单中使用方式同方案1。

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