为什么提交在我的 jquery 脚本中不起作用？

Question

我找出原因。 在旧版本上添加代码是我的错过。 我没有注意到从一开始就有一个现有的表格，并错误地在其中添加了另一个表格。 我保留原始内容。

我的 html 和脚本如下所示。 它使用 Django，它是一个 Django 模板，但我认为这是一个与 Django 无关的问题。 它显示以 ul 和 li 元素排列的目录或文件（如果有）的列表。 当我单击任何列表项（li 元素）时，我希望它会触发提交。 我可以看到 alert() 窗口，但我没有看到来自服务器端的 post 请求。 我在我的项目的另一个地方有一个类似的片段并且有效，但这没有。 我想不出我错过了什么？

<form id="id_f_sel" action="{% url 'integratedTest:addCase' %}" method="post">
        {% csrf_token %}
        <input type="hidden" id="id_f_clked" name="f_clked" value="">
            <ul id="id_dirlist">
                {%for item in dirs %}
                    <li><img src="{% static 'image/folder.png' %}" alt="unclicked folder image">
                    <span class="caret">{{item}}</span></li>
                {%endfor%}
            </ul>
        
            <ul id="id_flist">
                {%for item in files %}
                    <li><img src="{% static 'image/file.png' %}" alt="file image">
                    <span class="caret">{{item}}</span></li>
                {%endfor%}
            </ul>            
        </form>

<script>  
    $(document).ready(function() {    
        $('li').on('click', function() { 
          clk_val = $(this).text()  
          alert(clk_val)
          $('#id_f_clked').val(clk_val)  
          $('#id_f_sel').submit()          
        });
    });
</script>

浏览器开发 Windows 网络选项卡非常干净。 似乎没有发出任何请求。 有些行“[Violation] 'click' 处理程序花费了 1272 毫秒”我无法理解。

Answer 1

我会尝试使用<input type="submit">而不是使用带有点击功能的 li 。 或者尝试阻止您的表单被提交然后触发该功能。

遵循文档！

https://api.jquery.com/submit/