Skip to main content
 首页 » 编程设计

javascript之AJAX 调用 python 函数不会从 Django 中的 JavaScript 函数发生

2025年05月04日24落叶无声

这是一个完整的流程,必须在这里小心。我在 Django/Python/Web 开发中编码。

我有一个 html 页面,它有一个虚拟按钮,它触发了我现在想要执行的所有功能。我想要一个 uploadFunction() 来执行相同的操作,而不是虚拟按钮。我用谷歌搜索,发现最好的方法是使用 AJAX,因为要执行的操作需要访问服务器。

这是我在 jsfunctions.js 文件中的 uploadFunction()

    function upload() { 
   //does some upload       
    alert('before dummy') 
    ajaxCallFunction(); 
} 

我正在调用另一个单独文件 ajax.js 中的 ajaxCallFunction()。 ajaxCallFunction() 如下:

 $(document).ready(function(){ 
   function ajaxCallFunction(){ 
    alert('right before ajax call') 
     $.ajax({ 
        type: "POST", 
        url: "/dummy/{{ frame.slug }}/", 
        alert('AJAX CALL'); 
        data: { 
        'snapshot' : $('#snapshot').val(), 
        }, 
        success: dummy, 
        dataType: 'html' 
        alert('just finished') 
        } 
        headers:{ 
            'X-CSRFToken':csrftoken 
        } 
    }); 
} 
});     
 
function dummySuccess(data, textStatus, jqXHR) 
{ 
    $('#dummySuccess').html(data) 
} 

我希望我的 upload() 调用 ajaxCallFunction() 并将其重定向到 views.py 中的一个方法(我已将其映射到我的 urls.py 中)。但是,我的代码根本没有命中 ajaxCallFunction。(我看不到我放在 ajaxCallFunction 中的警报)。在我的调用页面中,我包含了所有这些内容。

<script language="javascript" type="text/css"> </script> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>         
<script language="javascript" src ="/static/js/jsfunctions.js"></script> 
<script language="javascript" src ="/static/js/ajax.js"></script> 

我的 ajax.js 中也有获取 CSRF Token 的函数(因为这是一个 post 方法)。我在这里错过了什么吗?我还需要做什么才能进行此 ajax 调用?请帮忙。提前致谢:)

请您参考如下方法:

在 JavaScript 中,加载 .js 文件的顺序很重要。 您是否尝试过在 jsfunctions.js 之前加载 ajax.js?

基本上,当 jsfunctions.js 在浏览器中加载时,如果 ajax.js 尚未加载,则 undefined 中的函数。

此外,请确保在 ajax 调用的 data 中存在一个名为 'csrfmiddlewaretoken' 的字段。从可维护性的 Angular 来看,您可以将数据保存在一个表单中,然后在将其发送到后端时序列化,而不是直接处理数据。像这样:

<form id="my-form" method="POST" action="/dummy/{{ frame.slug }}/"> 
    {% csrf_token %} 
    <input name="whatever" value="your_data_goes_here" /> 
</form> 

然后在你的 ajax 调用中:

var form = $('#my-form'); 
$.ajax({ 
    type: form.attr('method'), 
    url: form.attr('action'), 
    data: form.serialize(), 
    success: function() { 
        alert("Huzzah!"); 
    }, 
    error: function() { 
        alert("Oh no!"); 
    } 
}); 

最后,在您的 views.py 中,您可以处理您的数据:

if "whatever" in request.POST: 
    my_data = request.POST.get("whatever")