V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
woshichuanqilz
V2EX  ›  Flask

Flask 和 前端交互失败, 之前一直是 ok 的, 今天在打开出现问题, 请问是怎么回事?

  •  
  •   woshichuanqilz · 2018-01-11 14:29:46 +08:00 · 4154 次点击
    这是一个创建于 2506 天前的主题,其中的信息可能已经有所发展或是发生改变。

    就是一个很简单的交互的例子, 填入 a 和 b 求和 的一个例子, 之前测试的时候是 ok 的, 但是今天点击了计算的按键没有反应不知道是哪里的问题? 也不知道怎么调试求大神简单的指导一下调试的方法。

    而且这个代码载入也很慢。 20180111142804

    完整的测试文件在这里, 完整文件

    python 代码:

    from flask import Flask, render_template, request, jsonify
    
    app = Flask(__name__)
    
    
    @app.route('/')
    @app.route('/jstest.html')
    def index():
        return render_template('jstest.html')
    
    
    @app.route('/addnumber')
    def add():
        print('test')
        a = request.args.get('a', 0, type=float)
        b = request.args.get('b', 0, type=float)
        return jsonify(result=a + b)
    
    if __name__ == "__main__":
        app.run(debug = True)
    
    

    网页代码:

    <!DOCTYPE html>
      <html lang="en">
        <head>
          <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
          <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
          <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
          <script type=text/javascript>
            $(function() {
                $('#calculate').click(function(){
                  $.ajax({
                    url: '/addnumber',
                    data:{
                      a: $('#a').val(),
                      b: $('#b').val()
                    },
                    dataType: 'JSON',
                    type: 'GET',
                    success: function(data){
                        $("#result").html(data.result);
                    }
                    });
                 });
            });
      </script>
      </head>
      <body>
        <div class="container">
          <div class="header">
            <h3 class="text-muted">addNum</h3>
          </div>
          <hr/>
          <div>
          <p>
        <input type="text" id='a' size="5" name="a"> +
        <input type="text" id='b' size="5" name="b"> =
        <span id="result">?</span>
        <p><button class="btn btn-success" id="calculate">calculate</button>
          </form>
          </div>
        </div>
      </body>
    </html>
    
    
    10 条回复    2018-01-11 15:30:18 +08:00
    SP00F
        1
    SP00F  
       2018-01-11 14:35:43 +08:00
    手动传参请求 /addnumber 看下返回的结果,再在前端 ajax 方法 success 里面打印一下返回的数据是什么。

    看看数据结构有无错误
    nodejx
        2
    nodejx  
       2018-01-11 14:59:34 +08:00
    form ?
    htf176
        3
    htf176  
       2018-01-11 15:05:28 +08:00 via Android
    可能用了 google 的 cdn 导致 jquery 没加载上吧
    ohmyzsh
        4
    ohmyzsh  
       2018-01-11 15:07:52 +08:00
    我试了,可以
    woshichuanqilz
        5
    woshichuanqilz  
    OP
       2018-01-11 15:11:39 +08:00
    @ohmyzsh。。。那是我电脑的问题? 我怎么定位啊~~
    woshichuanqilz
        6
    woshichuanqilz  
    OP
       2018-01-11 15:11:58 +08:00
    @ohmyzsh 之前确实没问题, 今天就 gg 了不知道怎么回事。
    ohmyzsh
        7
    ohmyzsh  
       2018-01-11 15:14:56 +08:00
    @woshichuanqilz #3 楼说的有理,可以换 cdn 试试
    LYEHIZRF
        8
    LYEHIZRF  
       2018-01-11 15:17:57 +08:00
    看控制台啊
    woshichuanqilz
        9
    woshichuanqilz  
    OP
       2018-01-11 15:29:39 +08:00
    @ohmyzsh ok 谢谢 http://www.bootcdn.cn/jquery/ 使用这个 CDN OK 了 多谢各位
    kid7788
        10
    kid7788  
       2018-01-11 15:30:18 +08:00
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3418 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 19ms · UTC 11:33 · PVG 19:33 · LAX 03:33 · JFK 06:33
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.