Question

我要在同一页面上创建多个图表，现在我想要一个智能功能来更新单个图表或所有图表

当我对对象名称进行硬编码但我希望能够从它从

执行的按钮中获取对象名称时，它工作正常

<button class="update" name="prodChart1" funtionName="f_A_GetTotalWorkedHours"> Test</button>

var prodChart1 = document.getElementById('ProdChart1');
var prodChart1 = new Chart( prodChart1, {
  type: "line",
  data: <%=f_A_GetTotalWorkedHours(Dateadd("d",-2,Date), Date, 48, Line, "")%>,
  options: {
        color: 'red',
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
});


$(".update").click(function(){  
    UpdateChart($(this).attr("name"),"") 
});

function UpdateChart(chartName, aFunction) {
    $.ajax({
        type: 'POST', //post method
        url: 'AnalyticsAPI.asp?',
        dataType: "text",
        data: {requestParam: 'f_A_GetTotalWorkedHours|'+ getParam()[0] +'|'+ getParam()[1] +'|48' },
        success: function (result, textStatus, jqXHR)
        {
            data3= result; 
            chartName.config.data = JSON.parse(data3);
            chartName.update();

        },  
        error: function (xhr, ajaxOptions, thrownError) {
       // alert(xhr.status);
        alert(thrownError);
      }
    });
};

因此，“更新”功能应获取现有图表对象的名称，该对象名称是按钮名称属性的一部分。我得到的错误是“ UpdateChart（chartName，aFunction）”图表名不是对象。如果我可以在调用中对对象名称进行硬编码，那么它将起作用。

Answer 1

尝试一下：Get global variable dynamically by name string in JavaScript

或将图表添加到可以访问其键的对象中：

var charts = {};
charts.populationIncrease = new Chart(...);

function updateChart(chartName, value) {
    charts[chartName].value = value;
}

updateChart('populationIncrease', { ... });

Answer 2

问题是您正在尝试访问对象属性（获取和设置），但是正在尝试访问字符串$(this).attr("name")的属性相反，您应该在哪里使用$(this)

请参见下面的固定代码

var prodChart1 = document.getElementById('ProdChart1');
var prodChart1 = new Chart( prodChart1, {
  type: "line",
  data: <%=f_A_GetTotalWorkedHours(Dateadd("d",-2,Date), Date, 48, Line, "")%>,
  options: {
        color: 'red',
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
});


$(".update").click(function(){  
    UpdateChart($(this), $(this).attr("name"),""); //Pass in the object and the name
});

function UpdateChart(chartObject, chartName, aFunction) {
    $.ajax({
        type: 'POST', //post method
        url: 'AnalyticsAPI.asp?',
        dataType: "text",
        data: {requestParam: 'f_A_GetTotalWorkedHours|'+ getParam()[0] +'|'+ getParam()[1] +'|48' },
        success: function (result, textStatus, jqXHR)
        {
            data3= result; 
            chartObject.config.data = JSON.parse(data3); //you are using the object not the string attribute of name
            chartObject.update();

        },  
        error: function (xhr, ajaxOptions, thrownError) {
       // alert(xhr.status);
        alert(thrownError);
      }
    });
};

如何动态引用对象变量？

2 个答案: