碼上快樂

相關內容    簡體    繁體

Flask jQuery ajax

本文轉載自   查看原文   2015-07-09 10:47   2009    ajax

http://www.runoob.com/jquery/jquery-ref-ajax.html

http://jun1986.iteye.com/blog/1399242

 

下面是jQuery官方給出的完整的Ajax事件列表：

    • ajaxStart (Global Event)
      This event is broadcast if an Ajax request is started and no other Ajax requests are currently running.
      • beforeSend (Local Event)
        This event, which is triggered before an Ajax request is started, allows you to modify the XMLHttpRequest object (setting additional headers, if need be.)
      • ajaxSend (Global Event)
        This global event is also triggered before the request is run.
      • success (Local Event)
        This event is only called if the request was successful (no errors from the server, no errors with the data).
      • ajaxSuccess (Global Event)
        This event is also only called if the request was successful.
      • error (Local Event)
        This event is only called if an error occurred with the request (you can never have both an error and a success callback with a request).
      • ajaxError (Global Event)
        This global event behaves the same as the local error event.
      • complete (Local Event)
        This event is called regardless of if the request was successful, or not. You will always receive a complete callback, even for synchronous requests.
      • ajaxComplete (Global Event)
        This event behaves the same as the complete event and will be triggered every time an Ajax request finishes.
    • ajaxStop (Global Event)
      This global event is triggered if there are no more Ajax requests being processed.

 

$.post、$.get是一些簡單的方法，如果要處理復雜的邏輯，還是需要用到jQuery.ajax()

 

一、$.ajax的一般格式

$.ajax({

     type: 'POST',

     url: url ,

    data: data ,

    success: success ,

    dataType: dataType

});

 

二、$.ajax的參數描述

參數 描述

url 必需。規定把請求發送到哪個 URL。
data 可選。映射或字符串值。規定連同請求發送到服務器的數據。
success(data, textStatus, jqXHR) 可選。請求成功時執行的回調函數。
dataType

可選。規定預期的服務器響應的數據類型。

默認執行智能判斷（xml、json、script 或 html）。

 

三、$.ajax需要注意的一些地方：

  1.data主要方式有三種，html拼接的，json數組，form表單經serialize()序列化的；通過dataType指定，不指定智能判斷。

  2.$.ajax只提交form以文本方式，如果異步提交包含<file>上傳是傳過不過去,需要使用jquery.form.js的$.ajaxSubmit

 

通過 jQuery 使用 AJAX

http://dormousehole.readthedocs.org/en/latest/patterns/jquery.html

 

Flask中服務器端怎樣接受ajax發送的json？

 

Flask 如何響應 JSON 數據

一、一個小小的例子，展示 Flask 如果響應 JSON 數據

 

    300x108

    flask-ajax-json

    Flask 代碼：

   

Code example:

 

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    18

    19

    20

    21

    22

    23

    24

 

    # -*- coding: utf-8 -*-

    """

    ajax Example

    ~~~~~~~~~~~~~~

    一個簡單的應用，展示了 Flask 如果響應 JSON 數據。

    :copyright: (c) 2014 by Innes Luo.

    :license: BSD, see LICENSE for more details.

    """

    fromflaskimportFlask, jsonify, render_template, request

    app=Flask(__name__)

    @app.route('/', methods=['POST','GET'])

    defindex():

    ifrequest.method=='POST':

    n=[request.form.get(x,0,type=float)forxin{'n1','n2','n3'}]

    returnjsonify(max=max(n),min=min(n))

    else:

    returnrender_template('index.html')

    if__name__=='__main__':

    app.run()

 

    模板代碼：

   

Code example:

 

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    18

    19

    20

    21

    22

    23

    24

    25

    26

    27

    28

    29

    30

    31

    32

    33

    34

    35

    36

    37

    38

    39

    40

    41

    42

    43

    44

 

   

    <htmlxmlns="http://www.w3.org/1999/html"xmlns="http://www.w3.org/1999/html">

    <head>

    <metacharset="utf-8">

    <title>ajax Exampletitle>

    <scripttype=text/javascriptsrc="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.0.min.js">script>

    <scripttype=text/javascript.>

    var $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};

    function ajaxForm(){

    $.ajax({

    type: 'post',

    url: $SCRIPT_ROOT,

    dataType: 'json',

    data:{

    'n1': $('input[name=n1]').val(),

    'n2': $('input[name=n2]').val(),

    'n3': $('input[name=n3]').val()

    },

    error: function(xhr, err){

    alert('請求失敗，原因可能是：' + err + '！')

    },

    success: function(data, textStatus){

    $('#max').text(data.max);

    $('#min').text(data.min);

    }

    });

    return false

    }

    script>

    head>

    body>

    <h1>ajax Exampleh1>

    <formaction=""method="post"onSubmit="return ajaxForm()">

    <p>在下面 3 個文本框中輸入數字，然后點擊按鈕。p>

    <inputname="n1"type="text"/>

    <inputname="n2"type="text"/>

    <inputname="n3"type="text"/>

    <inputtype="submit"/>

    <p>最大數：<spanid=max>?span>p>

    <p>最小數：<spanid=min>?span>p>

    form>

    body>

    html>

 

 

 

flask resquest響應POST請求的json數據問題?

http://www.oschina.net/question/2337216_233467

Post函數未添加關鍵字。

r = requests.post('http://localhost:5000/login',json.dumps(values),headers);

具體參見：

http://www.python-requests.org/en/latest/user/quickstart/#more-complicated-post-requests

http://stackoverflow.com/questions/14112336/flask-request-and-application-json-content-type?rq=1

http://blog.csdn.net/iloveyin/article/details/21444613

 


免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 Flask---ajax(jquery)交互 Python flask jQuery ajax 上傳文件 Jquery使用ajax與Flask后端進行數據交互 前端與后端的數據交互（jquery ajax+python flask） 前端與后端的數據交互（jquery ajax+python flask） Flask與Ajax 前端和后端的數據交互(jquery ajax+python flask+mysql) flask與javascript及ajax 使AJAX可緩存——基於flask Flask和Ajax交互
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM