首页 / JQUERY / Python - Django - jQuery 实现简单的 AJAX

Python - Django - jQuery 实现简单的 AJAX

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了Python - Django - jQuery 实现简单的 AJAX，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1382字，纯文字阅读大概需要2分钟。

内容图文

AJAX 局部刷新实例：

使用 jQuery 实现基本的发送 AJAX 请求

index.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title> ajax 局部刷新实例 </title>
</head>
<body>

<input type="text" id="i1">+
<input type="text" id="i2">=
<input type="text" id="i3">
<input type="button" value="AJAX提交" id="b1">

<script src="/static/jquery-3.3.1.js"></script>
<script>
  $("#b1").on("click", function () {
    $.ajax({
      url:"/ajax_add/",
      type:"GET",
      data:{"i1":$("#i1").val(),"i2":$("#i2").val()},
      success:function (data) {
        $("#i3").val(data);
      }
    })
  })
</script>

</body>
</html>

 urls.py：

from django.conf.urls import url
from app01 import views


urlpatterns = [
    url(r'^index/', views.index),
    url(r'^ajax_add/', views.ajax_add),
]

views.py：

from django.shortcuts import render, HttpResponse


def index(request):
    return render(request, "index.html")


def ajax_add(request):
    num1 = request.GET.get("i1")
    num2 = request.GET.get("i2")
    ret = int(num1) + int(num2)
    return HttpResponse(ret)

访问，http://127.0.0.1:8000/index/

Python - Django - jQuery 实现简单的 AJAX - 文章图片

 

 输入两组数，点击 “AJAX提交”，页面没有刷新也会计算出结果

 

上例 AJAX 代码解析：

<button id="b1">AJAX 测试</button>
<script>
  $("#b1").click(function () {  # 如果 id 为 b1 的按钮被点击
    $.ajax({
      url: "/ajax_add/",   # ajax 数据请求的 URL
      type: "GET",         # 请求的方式
      data:{"i1":$("#i1").val(),"i2":$("#i2").val()},  # 要发送的数据
      success: function (data) {   # 如果请求被正常处理就执行该函数
        alert(data)
      }
    })
  })
</script>

 

内容总结

以上是互联网集市为您收集整理的Python - Django - jQuery 实现简单的 AJAX全部内容，希望文章能够帮你解决Python - Django - jQuery 实现简单的 AJAX所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/721082.html

来源：【匿名】