Jquery 使用ajax和django传递信息_Jquery_Python_Ajax_Django_Python 2.7

Jquery 使用ajax和django传递信息

jquery python ajax django python-2.7

Jquery 使用ajax和django传递信息,jquery,python,ajax,django,python-2.7,Jquery,Python,Ajax,Django,Python 2.7,我正在尝试用django视图测试ajax的使用。我对ajax和django还不熟悉。我已经创建了一个由3*3个按钮单元组成的网格。当我单击任何按钮时，它会将其文本替换为和“X”，然后在ajax的帮助下将其传递给视图“handler”。但在我的例子中，它并没有将控件传递给视图“handler”。我不明白为什么它不起作用。这是我的密码： url文件： from django.conf.urls import include, url from django.contrib import

我正在尝试用django视图测试ajax的使用。我对ajax和django还不熟悉。我已经创建了一个由3*3个按钮单元组成的网格。当我单击任何按钮时，它会将其文本替换为和“X”，然后在ajax的帮助下将其传递给视图“handler”。但在我的例子中，它并没有将控件传递给视图“handler”。我不明白为什么它不起作用。这是我的密码：

url文件：

 from django.conf.urls import include, url
    from django.contrib import admin
    from game import views
    urlpatterns = [
        url(r'^admin/', admin.site.urls),
        url(r'^handler/',views.handler,name='handler'),
        url(r'^$',views.home,name='home'),
    ]

视图文件

from django.shortcuts import render
    from django.http import HttpResponse
    from django.http import Http404

    def handler(request):
        if request.is_ajax():
            pos = request.POST['pos']
            return HttpResponse(2)
        else:
            raise Http404
    def home(request):
        context = {}
        return render(request,"game/home.html",context)

home.html文件：

<head>
<head>
<style>
td {
    padding:0;
}
table {
    height:240px;
    width:240px;
    border-collapse: collapse;
    border-spacing: 0
}
input {
    margin:0;
    width:80px;
    height:80px;
    font-size: 50px;
    text-align: center;
}
#content {
    position:absolute;
    top:210px;
    left:540px;
}
</style>
<script>
function change(id)
{
    var y = document.getElementById(id);
    y.value = 'X';
    $.ajax({
        url:"handler/",
        type:"POST",
        data:{pos:id},

        success:function(data) {
            var x = document.getElementById(data);
            x.value = 'O';
            console.log("sucess");
        },
        error:function(xhr,errmsg,err) {
            alert("error");
        }
    });
}
</script>
</head>
<body>
<div id = "content">
<center><table>
<tr>
<td><input type = "button" onclick="change(1)" id = "1"></input></td>
<td><input type = "button" onclick="change(2)" id = "2"></input></td>
<td><input type = "button" onclick="change(3)" id = "3"></input></td>
</tr>
<tr>
<td><input type = "button" onclick="change(4)" id = "4"></input></td>
<td><input type = "button" onclick="change(5)" id = "5"></input></td>
<td><input type = "button" onclick="change(6)" id = "6"></input></td>
</tr>
<tr>
<td><input type = "button" onclick="change(7)" id = "7"></input></td>
<td><input type = "button" onclick="change(8)" id = "8"></input></td>
<td><input type = "button" onclick="change(9)" id = "9"></input></td>
</tr>
</table>
</center>
</div>
</body>
</html>


运输署{
填充：0；
}
桌子{
高度：240px；
宽度：240px；
边界塌陷：塌陷；
边框间距：0
}
输入{
保证金：0；
宽度：80px；
高度：80px；
字体大小：50px；
文本对齐：居中；
}
#内容{
位置：绝对位置；
顶部：210px；
左：540px；
}
功能更改（id）
{
var y=document.getElementById（id）；
y、 值='X'；
$.ajax({
url:“处理程序/”，
类型：“POST”，
数据：{pos:id}，
成功：功能（数据）{
var x=document.getElementById（数据）；
x、 值='O'；
控制台日志（“成功”）；
},
错误：函数（xhr、errmsg、err）{
警报（“错误”）；
}
});
}

使用csrf\u豁免装饰器，因为您不通过ajax发送csrf令牌。此外，请确保已将

包含到模板文件中。这应该行得通

from django.views.decorators.csrf import csrf_exempt
from django.shortcuts import render
from django.http import HttpResponse
from django.http import Http404

@csrf_exempt
def handler(request):
    if request.is_ajax():
        pos = request.POST['pos']
        return HttpResponse(2)
    else:
        raise Http404

在

pos=request下添加print'Checkpoint'
和print pos
。发布['pos']

，并在激活AJAX请求时告诉我控制台中是否打印了任何内容。另外，

success

或

error

函数是否返回

console.log（'success'）

或

alert（“error”）

？事实上，控件甚至没有传递到您要求打印的“handler”视图。有许多事情可能出错。其中一个我可以看到的是，您没有处理

csrf

token，这可能会给您403响应。你应该打开浏览器的控制台，看看情况是否如此。如果是这样，您的view.py方法甚至可能不会被调用@ShangWang可能是对的，尝试将

数据：{pos:id}，

更改为

数据：{pos:id，'csrfmiddlewaretoken'：{{csrf_token}}}，

-即使这不是主要问题，您也需要它。如果有帮助，请告诉我。我改变了，但问题仍然存在