Django：如何将图片设为模板按钮并让views.py识别其点击

问题核心 #

当使用<input type="image">作为表单提交按钮时，浏览器不会像普通<input type="submit">那样提交按钮的name和value，而是会提交两个参数：[按钮name].x和[按钮name].y，对应点击位置的坐标。因此直接用request.POST.get('按钮name')无法检测到点击状态。

解决方案：检查坐标参数是否存在 #

只需在视图中判断[按钮name].x或[按钮name].y是否存在于request.POST中，即可确认该图片按钮被点击。

1. HTML代码（图片按钮）

替换原来的submit按钮为image类型：

<!-- 替换你的submit按钮 -->
<input type="image" 
       src="/static/images/add-service-btn.png"  <!-- 你的图片路径 -->
       name="Add Other Service" 
       alt="Add Selected Other Service to Included Service">

2. Django视图判断逻辑

在views.py中通过检查坐标参数来判断点击：

def your_view(request):
    if request.method == 'POST':
        # 检查图片按钮是否被点击
        if 'Add Other Service.x' in request.POST:
            # 执行添加服务的逻辑
            # 后续处理...
            pass
        # 其他按钮的判断逻辑
        # elif 'Another Button.x' in request.POST:
        #     ...
    # 其他视图逻辑
    return render(request, 'your-template.html')

补充说明 #

• 不管点击图片的哪个位置，只要触发提交，[按钮name].x和[按钮name].y都会被提交到后端，所以只需检查其中一个参数是否存在即可。
• 所有主流浏览器都会支持该参数提交，无需额外兼容处理。

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