我有一个HTML标记，当它被点击时，它应该在我的Java文件(app.js)中运行一个函数(这是使用onClick标记属性实现的)
但我得到的却是以下错误:
Uncaught ReferenceError: summon_chat is not defined at HTMLLIElement.onclick个
但是，当我在我的Java脚本文件(app.js)中编写类似以下代码的代码时，它可以工作:
const list_item = document.querySelector('#listId')
list_item.onclick = function () {
summon_chat()}
但是，如果我不在app.js文件中使用list_item.onClick，并且不使用该函数，而是使用onClick属性将其直接传递给HTML标记，那么它就不能工作
function summon_chat(chat){
//logic
}我做错了什么？ 我的base.html文件位于模板/布局/ 我的index.html位于模板/
以下是调用该函数的index.html片段:
<li onclick="console.log('CLICKED'); summon_chat(this);" class="list-group-item p-3">
这是我的基本.html:
{% load static %}
<!DOCTYPE html>
<html lang="en" data-bs-theme="light">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}{% endblock title %}</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<link rel="stylesheet" href="{% static 'styles.css' %}">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
<script src="https://unpkg.com/htmx.org@1.9.10" integrity="sha384-D1Kt99CQMDuVetoL1lrYwg5t+9QdHe7NLX/SoJYkXDFfX37iInKRy5xLSi8nO7UC" crossorigin="anonymous"></script>
<script src="{% static 'app.js' %}" type="module"></script>
{% block script %}{% endblock script %}
</head>
<body>
<div class="container-fluid">
<main>{% block content %}{% endblock content %}</main>
</div>
</body>
</html>
我已经在浏览器中判断了开发控制台，JavaScript文件加载正确，我甚至在JS文件的开头添加了console.log，它在控制台中打印，我已经删除了浏览器缓存20次，我判断了渲染HTML，没有任何错误，我已经在这里搜索了解决方案，我已经在index.html文件中正确扩展了我的base.html，我已经在index.html和base.html中使用了{% load static %}.