Question

在我的django网络应用程序上，我有一个网页，当点击一个按钮时，会打开一个模态表单。在此表单上有几个字段和一个保存按钮。按下保存按钮时，我想做一些事情，比如打印警报。这是我试过的：

模型表单代码：

<div class="container-content">
    <div class="infor-experience col-lg-2 more_info">
    {% if request.user|isEmployer %}
        <div class="add-to-list">{% include "layout/addtolistmodal.html" %}</div>
        <div class="connect-now bottom">{% include "layout/bidmodal.html" %}</div>
    {% endif %}
 <!-- more code below here -->

Javascript在与上述模式相同的HTML文件中阻止：

<script type="text/javascript">
    // Add to short list handler
    $('.add-to-list').on('click', '.submit', function(e) {
        alert("TEST");
    })
</script>

基本上，我想要做的是当用户点击添加到列表模式的保存时，打印警报＆＃34; TEST＆＃34;。

根据我的理解，它不起作用的原因是因为它无法找到＆＃39; .add-to-list＆＃39;但我应该使用什么？

Answer 1

只需将您的click event附加到已经显示为element的{{1}}，因为div.infor-experience modal会在html之后追加。此外，如果您提供了任何渲染条件，请确保您的DOM load在网络浏览器中呈现。

script

Answer 2

可能是您的脚本定位。在执行时，DOM可能尚未就绪或尚未存在。

您可以像这样包装与DOM相关的代码：

$(document).ready(init);

function init(){ 
  $('.add-to-list').on('click', '.submit', function(e) {
    alert("TEST");
  })
}

Answer 3

试试这个

$(document).ready(function () {
    $('.add-to-list').on('click', '.submit', function(e) {
        alert("TEST");
    });
});

你应该在$（document）.ready（）下添加代码，以便它等待整个DOM加载，然后在加载DOM之前附加方法而不是这样做。

如何获取模型表单按钮的单击事件？

3 个答案: