V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
raighne
V2EX  ›  JavaScript

做一个余额查询的 ajax 请教

  •  
  •   raighne · 2016-10-05 19:34:32 +08:00 · 2788 次点击
    这是一个创建于 2971 天前的主题,其中的信息可能已经有所发展或是发生改变。

    已经封装好了一个 API:/api/getschoolcardmonery/:id

    比如访问 localhost:3000/api/getschoolcardmonery/10000 会返回一个 json :

    { "schoolCard_Id": 10000, "leftMenory": 8979 }

    前端定义了一个<input>和<button>

    怎么写 ajax ,点击 button 查询 input 输入的 id 的 leftMenory 的值。

    19 条回复    2016-10-06 11:22:02 +08:00
    zhaohui318
        1
    zhaohui318  
       2016-10-05 20:06:00 +08:00
    http://www.w3schools.com/jquery/ajax_getjson.asp

    使用 jQuery getJSON() 方法,里面有例子
    shiji
        2
    shiji  
       2016-10-05 20:31:38 +08:00
    $('#input 的 HTML 元素 id').click(function (){
    随便起个名字();
    });
    function 刚才起的那个名字(){
    $.ajax({
    type: "GET",
    url: "/api/getschoolcardmonery/10000",
    success: function (data) {
    alert(data['leftMenory']);
    }, error: function () {
    alert("出了点什么错误");
    }
    });

    }
    大概是这样,不知道排版会不会乱
    shiji
        3
    shiji  
       2016-10-05 20:33:31 +08:00 via Android
    @shiji 擦 写错了,第一个是查询按钮的 id
    raighne
        4
    raighne  
    OP
       2016-10-05 20:43:15 +08:00
    @shiji 这个 url 是需要变化的 需要根据我 input 里输入的查询 id 返回不同的值的

    比如我要查询的 id 是 1000 ,就请求 /api/getschoolcardmonery/10000
    如果想查询 11111 ,就请求 /api/getschoolcardmonery/11111
    shiji
        5
    shiji  
       2016-10-05 20:47:49 +08:00
    @raighne
    那就文本拼接啊
    function 刚才起的那个名字(){
    var cardID = $('#学生卡号 input 的 html 元素 ID').val().trim();
    $.ajax({
    type: "GET",
    url: "/api/getschoolcardmonery/"+ cardID,
    success: function (data) {
    alert(data['leftMenory']);
    }, error: function () {
    alert("出了点什么错误");
    }
    });

    }
    stillwaiting
        6
    stillwaiting  
       2016-10-05 20:49:58 +08:00
    @shiji 好有耐心 -_-,本来想吐槽 lz 的
    raighne
        7
    raighne  
    OP
       2016-10-05 20:51:53 +08:00
    @stillwaiting
    @shiji 多谢多谢,新学 JavaScript ,多谢指导
    majinjing3
        8
    majinjing3  
       2016-10-05 20:53:55 +08:00 via Android
    @shiji 好评?
    majinjing3
        9
    majinjing3  
       2016-10-05 20:54:09 +08:00 via Android
    @shiji 好评!
    raighne
        10
    raighne  
    OP
       2016-10-05 20:57:17 +08:00
    @shiji alert 出来是 undefined
    raighne
        11
    raighne  
    OP
       2016-10-05 20:58:38 +08:00
    @shiji 换成 data.leftMonery
    shiji
        12
    shiji  
       2016-10-05 21:11:03 +08:00
    @raighne 这个有可能是你的 Ajax 没有返回正确的 header , 你检查一下 ajax 的请求 header 里面有没有这一句:
    Content-Type: application/json
    shiji
        13
    shiji  
       2016-10-05 21:35:52 +08:00   ❤️ 1
    aaronlam
        14
    aaronlam  
       2016-10-05 22:20:17 +08:00
    @shiji 这耐心,就是想赞一个!
    precisi0nux
        15
    precisi0nux  
       2016-10-06 06:52:18 +08:00 via iPhone
    leftMoney ?你是想说 balance 吗?
    shuson
        16
    shuson  
       2016-10-06 09:41:08 +08:00
    leftmoney ,这命名让人陶醉。
    balance 除了平衡,生活中更常用作“余额”
    xbdsky
        17
    xbdsky  
       2016-10-06 10:56:54 +08:00
    @shuson 没用中文命名就不错了
    raighne
        18
    raighne  
    OP
       2016-10-06 11:15:15 +08:00
    @precisi0nux
    @shuson
    @xbdsky 感谢提醒
    raighne
        19
    raighne  
    OP
       2016-10-06 11:22:02 +08:00
    @shiji 多谢耐心指导,确实是 Ajax 没有返回正确的 header
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2721 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 15:05 · PVG 23:05 · LAX 07:05 · JFK 10:05
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.