Javascript, Html, Dango data transition[2]


my/bs/urls.py

## ajax 1
url(r'^bs6$', views.bs_bs6, name="bootstrap_bs6"),
url(r'^add/$', views.add, name="bootstrap_add"),
url(r'^ajax_dict/$', views.ajax_dict, name="bootstrap_ajax_dict"),
url(r'^ajax_list/$', views.ajax_list, name="bootstrap_ajax_list"),

my/bs/views.py

#######################################################################
## Ajax_1
#######################################################################
from django.http import HttpResponse
try:
    from django.http import JsonResponse
except ImportError:
    from .tool import JsonResponse


def bs_bs6(request):
    return render(request, 'bs6.html')

def add(request):
    a = request.GET['a']
    b = request.GET['b']
    a = int(a)
    b = int(b)
    return HttpResponse(str(a+b))

def ajax_dict(request):
    name_dict = {'twz': 'Love python and Django', 'zqxt': 'I am teaching Django'}
    #return HttpResponse(json.dumps(name_dict), content_type='application/json')
    return JsonResponse(name_dict)

my/static/html/bs6.html

<body>
  <p>Input two numbers please!</p>

  <form action="/bs/add/" method="get">
      a: <input type="text" id="a" name="a"> <br>
      b: <input type="text" id="b" name="b"> <br>
      <p>result: <span id='result'></span></p>
      <button type="button" id='sum'>提交</button>
  </form>

  <div id="dict">Ajax 加载字典</div>
  <p id="dict_result"></p>

  <div id="list">Ajax 加载列表</div>
  <p id="list_result"></p>

  <script src="http://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js"></script>
  <script>
      $(document).ready(function(){
        // 求和 a + b
        $("#sum").click(function(){
          var a = $("#a").val();
          var b = $("#b").val();

          $.get("/bs/add/",{'a':a,'b':b}, function(ret){
              $('#result').html(ret);
          })
        });

        // 字典 dict
        $('#dict').click(function(){
            $.getJSON('/bs/ajax_dict/',function(ret){
                //返回值 ret 在这里是一个字典
                $('#dict_result').append(ret.twz + '<br>');
                // 也可以用 ret['twz']
            })
        })
      });
  </script>
  </body>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值