我有一个 HTML 网页,其中有一个按钮示例,如 Django 应用程序的一部分所示,该应用程序在插入值后填写名称和城镇:
{% for person in page_obj %}
<button id="NotifyBtn" name="person.FName" town="person.LName">Press Me</button>
{% endfor %}
<button id="NotifyBtn" name="Billy" town="Bob">Press Me</button>
<button id="NotifyBtn" name="Timmy" town="Tawin">Press Me</button>
<button id="NotifyBtn" name="Milly" town="House">Press Me</button>
然后我有一个执行以下操作的 JS:
document.getElementById("NotifyBtn").addEventListener("click", function(){
var name = this.getAttribute("name");
var town = this.getAttribute("town");
fetch("{% url 'alert_via_JSON_Response' %}", {
method: "POST",
headers: {
"X-CSRFToken": "{{ csrf_token }}",
"Content-Type": "application/json"
},
body: JSON.stringify({ message: "Hi there: " + `${name} born in ${town}`
})
}).then(response => response.json())
.then(data => alert(data.status));
});
在我的 Django 应用程序中,我有以下内容:
def alert_via_JSON_Response(request):
if request.method == 'POST':
data = json.loads(request.body)
message = data.get('message', "Error in sending email")
return JsonResponse({"status": f"{message}"})
return JsonResponse({"status": f"No Message"})
现在,当我点击网页时,只有一个按钮起作用并向网页发送 JSON 响应,如果我在按下第一个按钮后再按下另一个按钮,它就不起作用了。有没有办法在需要时按下每个按钮并显示每个按钮的 JSON 响应?