如何将新数字传递给函数中的变量?

时间:2018-01-25 22:41:15

标签: javascript jquery json ajax

所以我从JSON文件中获取这些数字:

var homePoints = game.total_points_bet_on_hometeam;
var awayPoints = game.total_points_bet_on_awayteam;

但稍后在我的代码中我使用ajax调用来提交新数字并检索新的JSON数字。我如何将homePoints和awayPoints更改为我的ajax电话中的新号码?

我查看了我给出的答案,但这些答案似乎与我试图做的不相符。现在,我需要替换数字的变量位于另一个调用JSON的函数中。

         $.each(gameData, function(key, game){
            var homePoints = game.total_points_bet_on_hometeam;
            var awayPoints = game.total_points_bet_on_awayteam;
            var totalPoints = homePoints + awayPoints;

            var myChart = new Chart(ctx, {
                  type: 'doughnut',
                  data: {
                    labels: [homeShort, awayShort],
                    datasets: [{
                      backgroundColor: [
                        homeColor,
                        awayColor
                      ],
                      data: [homePoints, awayPoints]
                    , borderWidth: 0
                    }]
                  },
                  options: {
                        responsive: true
                    ,   maintainAspectRatio: true
                  }
                });
               };

$.ajax({
              url: "---------/dbdata/bet/new/" + userId + "/"+ gameId +"/"+ id +"/"+ value +"",
              type: "get",
            success: function(response) {
                function update(){

                var currentSelection = $('#team-select').val();

                    getGames().done(function(results){
                        $.each(results, function (i, gameData){
                            $.each(gameData, function(key, game){

                                    var gamesId = game.id;

                                    // clears the current bet totals and replaces them with new ones.
                                    if(gameId === gamesId){
                                        var totalPointsHome = this.total_points_bet_on_hometeam;
                                        var totalPointsAway = this.total_points_bet_on_awayteam;
                                        var homePoints = this.total_points_bet_on_hometeam;
                                        var awayPoints = this.total_points_bet_on_awayteam;
                                        var totalPoints = homePoints + awayPoints;

                                        console.log(homePoints)

                                        $('#' + gameId + ' .total-points').empty();
                                        $('#' + gameId + ' .total-points').append( totalPointsAway + totalPointsHome);



                                    }

                            });
                        });
                    })
                }

                update();

1 个答案:

答案 0 :(得分:1)

  

@ gforce301你能解释一下如何制作一个可重复使用的函数吗?

当然,我会试一试。

看起来你有一些你正在使用的“图表”库和一些你正在显示某些信息的标记。所以让我们从一个变量开始,在全局范围内保存我们的“图表”和一个函数创建/更新它们。像这样:

var charts = {};

function updateChart(game) {
    var chart = charts[game.id],
        homePoints = game.total_points_bet_on_hometeam,
        awayPoints = game.total_points_bet_on_awayteam,
        totalPoints = homePoints + awayPoints;

    // do we have a chart for this game yet? no make one
    if(!chart]) {
        charts[game.id] = new Chart(ctx, {
            type: 'doughnut',

            data: {
                labels: [homeShort, awayShort],
                datasets: [{
                    backgroundColor: [homeColor, awayColor],
                    data: [homePoints, awayPoints],
                    borderWidth: 0
                }]
            },

            options: {
                responsive: true,
                maintainAspectRatio: true
            }
        });
    }
    // yes update the chart
    else {
        // Here is code to update an existing chart which 
        // I know nothing about your charts so you have to write this part
        chart.setSomeProperty('property', value); // <- or however it's done
    }
}

我们还需要一个函数来更新一些我看到jQuery善良的标记。让我们这样做:

function updateMarkup(game) {
    var totalPointsHome = game.total_points_bet_on_hometeam,
        totalPointsAway = game.total_points_bet_on_awayteam,
        homePoints = game.total_points_bet_on_hometeam,
        awayPoints = game.total_points_bet_on_awayteam,
        totalPoints = homePoints + awayPoints;

    $('#' + game.id + ' .total-points').empty();
    $('#' + game.id + ' .total-points').append( totalPointsAway + totalPointsHome);
}

现在我们有了这个,在我们有初始gameData的开始处,我们只是循环它并调用我们的更新函数。像这样:

$.each(gameData, function(key, game) {
    updateChart(game);
    updateMarkup(game);
}

现在稍后我们会做一些ajax调用并获得一些新的游戏数据。我们只是循环数据并再次调用我们的更新函数。像这样:

$.ajax({
    url: "---------/dbdata/bet/new/" + userId + "/"+ gameId +"/"+ id +"/"+ value +"",
    type: "get",

    success: function(response) {
        var gameData = response.data // or wherever the data is in the response
        $.each(gameData, function(key, game) {
            updateChart(game);
            updateMarkup(game);
        });
    }
});