首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >jQuery Ajax通过函数获取值?

jQuery Ajax通过函数获取值?
EN

Stack Overflow用户
提问于 2017-07-06 22:13:02
回答 2查看 43关注 0票数 2

我已经创建了一个提交ajax post请求的save(id)函数。调用save(id)时。如何在进入下一步之前从save(id)获取值/数据。如何解决这个问题?

例如:

代码语言:javascript
复制
        function save(id) {
            $.ajax({
                type: "POST",
                url: "/post/",
                dataType: "json",
                contentType: 'application/json',
                data: JSON.stringify({
                    id: id,
                }),
                success: function (data) {
                 return data;
                },
                error: function (error) {
                return data;
                }
            });
        }

用法:

代码语言:javascript
复制
$('.btn-create').click(function () {
  var id = 123;
  data = saveArea(id); //get data from ajax request or error data?
  if (data) { 
     window.location = "/post/" + data.something
  }
}
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2017-07-06 22:17:10

您有两种选择,要么同步运行AJAX调用(不推荐)。或使用回调以异步方式

同步

正如@Drew_Kennedy提到的,这将冻结页面,直到它完成,降低用户体验。

代码语言:javascript
复制
function save(id) {
    return $.ajax({
        type: "POST",
        url: "/post/",
        dataType: "json",
        contentType: 'application/json',
        async: false,
        data: JSON.stringify({
            id: id,
        })
    }).responseText;
}

$('.btn-create').click(function () {
  var id = 123;
  // now this will work
  data = save(id);
  if (data) { 
     window.location = "/post/" + data.something
  }
}

异步(推荐)

这将在后台运行,并允许在页面上进行正常的用户交互。

代码语言:javascript
复制
function save(id, cb, err) {
    $.ajax({
        type: "POST",
        url: "/post/",
        dataType: "json",
        contentType: 'application/json',
        data: JSON.stringify({
            id: id,
        }),
        success: function (data) {
            cb(data);
        },
        error: err // you can do the same for success/cb: "success: cb"
    });
}

$('.btn-create').click(function () {
  var id = 123;
  save(id, 
    // what to do on success
    function(data) { 
      // data is available here in the callback
      if (data) { 
          window.location = "/post/" + data.something
      }
    },
    // what to do on failure
    function(data) {
      alert(data);
    }
  });
}
票数 4
EN

Stack Overflow用户

发布于 2017-07-06 23:11:27

只是让事情变得简单一点。

对于初学者,只需将window.location = "/post/" + data.something添加到成功回调中即可。如下所示:

代码语言:javascript
复制
function save(id) {
    return $.ajax({
        type: "POST",
        url: "/post/",
        dataType: "json",
        contentType: 'application/json',
        data: JSON.stringify({
            id: id,
        }),
        success:function(data){
            window.location = "/post/" + data.something
        }
    }).responseText;
} 

或者在click事件中添加所有Ajax代码。

代码语言:javascript
复制
$('.btn-create').click(function () {
   var id = "123";

   $.ajax({
    type: "POST",
    url: "/post/",
    dataType: "json",
    contentType: 'application/json',
    data: JSON.stringify({
        id: id,
    }),
    success: function (data) {
     window.location = "/post/" + data.something
    },
    error: function (error) {
      console.log(error)
    }
  });

}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/44951407

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档