Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/437.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript可以';t在带有循环的函数中添加参数_Javascript_Jquery_Html Table - Fatal编程技术网

Javascript可以';t在带有循环的函数中添加参数

Javascript可以';t在带有循环的函数中添加参数,javascript,jquery,html-table,Javascript,Jquery,Html Table,我有一个代码,当应用到html表时,应该执行热图: html表格代码: <table class='table' id='js-datatable' cellspacing="0.9" cellpadding="8" border="1"> <tr> <th align=center style="white-space: nowrap;" bgcolor=gre

我有一个代码,当应用到html表时,应该执行热图:

html表格代码:

<table class='table' id='js-datatable' cellspacing="0.9" cellpadding="8" border="1">
    <tr>
        <th align=center style="white-space: nowrap;" bgcolor=grey>product</th>
        <th align=center style="white-space: nowrap;" bgcolor=grey>Jan</th>
        <th align=center style="white-space: nowrap;" bgcolor=grey>Feb</th>
        <th align=center style="white-space: nowrap;" bgcolor=grey>Mar</th>
        <th align=center style="white-space: nowrap;" bgcolor=grey>Apr</th>
        <th align=center style="white-space: nowrap;" bgcolor=grey>May</th>
    </tr>
    <tr class='heatmap-stable'>
        <td align=center>K22</td>
        <td align=center>655$</td>
        <td align=center>365$</td>
        <td align=center>265$</td>
        <td align=center>125$</td>
        <td align=center>36$</td>
    </tr>
    <tr class='heatmap-stable'>
        <td align=center>K52</td>
        <td align=center>90</td>
        <td align=center>50</td>
        <td align=center>120</td>
        <td align=center>80</td>
        <td align=center>190</td>
    </tr>
    <tr class='heatmap-stable'>
        <td align=center>J42</td>
        <td align=center>1267</td>
        <td align=center>1567</td>
        <td align=center>347</td>
        <td align=center>697</td>
        <td align=center>70</td>
    </tr>
    <script src='https://cdn.bootcdn.net/ajax/libs/jquery/2.1.3/jquery.js'></script>
    <script type='text/javascript' src='script.js'></script>
</table>
function clean_formatted_data(str) {
    return parseFloat (str.replace (/([%,$,\,])+/g, ''));
}

function col_to_array(tbl_col, target) {
    // Returns column `n` (zero indexed) in table id `target` as an array

    var colArray = $ ('#' + target + ' td:nth-child(' + tbl_col + ')').map (function () {
        return clean_formatted_data ($ (this).text ());
    }).get ();

    return colArray;
}

//------ new schtuff ------------------------//

function get_pos_of_max(col_data) {
    return $.inArray (Math.max.apply (Math, col_data), col_data)
}

function generate_opacities(col_data, max) {
    var opacity_array = [];
    var increment = max / (col_data.length);

    for (i = col_data.length; i >= 1; i--) {
        opacity_array.push (i * increment / 100);
    }

    return opacity_array;
}


function process_col_best_performing(tbl_col, target) {
    var col_data = col_to_array (tbl_col, target);
    var opacity_array = generate_opacities (col_data, 50);
    var row_count = col_data.length;

    for (var i = 1; i <= row_count; i++) {
        $ ('#' + target + ' tr:nth-child(' + (get_pos_of_max (col_data) + 1) + ') td:nth-child(' + tbl_col + ')').css ('background', 'rgba(0,0,255,' + opacity_array[0] + ')');
        col_data[get_pos_of_max (col_data)] = null;
        for (const spliceElement of opacity_array.splice (0, 1)) {

        }

    }
}
但因为这只是一个示例,真正的html表可以有任意数量的列,我想用for循环实现这一点,我尝试了下面的代码,但它不起作用

var cols_qty = document.getElementById ('js-datatable').rows[0].cells.length
var i;
for(i = 1; i < 4; i++) {
    console.log(i)
    process_col_best_performing(tbl_col=i,'js-datatable');
}
var cols\u qty=document.getElementById('js-datatable')。行[0]。单元格.length
var i;
对于(i=1;i<4;i++){
控制台日志(i)
进程性能最佳(tbl\U col=i,'js-datatable');
}

*我对javascript一无所知,因此如果您知道答案,请尽可能用最简单的方式解释。

不确定这是否有帮助,但请尝试下面的代码,首先不要声明为全局变量I;在for循环之前,我不确定您是否在代码中执行了相同的操作,但相同的I在函数中发生了更改,并影响了调用process\u col\u best\u performing的循环。检查下面的代码,看看这是否有意义

var cols\u qty=document.getElementById('js-datatable')。行[0]。单元格.length
对于(变量i=1;i<4;i++){
控制台日志(i)
进程性能最佳(i,“js-datatable”);
}
函数清除格式化数据(str){
返回parseFloat(str.replace(/([%,$,\,])+/g',);
}
功能列到列(待测列,目标){
//以数组形式返回表id“target”中的列“n”(零索引)
var colArray=$('#'+target+'td:n个子('+tbl_col+')).map(函数(){
返回干净的格式化数据($(this.text());
}).get();
返回数组;
}
//------新施塔夫------------------------//
函数获取最大值的位置(列数据){
返回$.inArray(Math.max.apply(数学、列数据)、列数据)
}
函数生成不透明度(列数据,最大值){
var不透明度_数组=[];
var增量=最大/(列数据长度);
对于(变量i=col_data.length;i>=1;i--){
不透明度_array.push(i*增量/100);
}
返回数组;
}
功能流程最佳性能(待定,目标){
var col_data=col_to_数组(tbl_col,target);
var不透明度数组=生成不透明度(颜色数据,50);
变量行计数=列数据长度;

对于(var i=1;我不确定这是否有帮助,请尝试将
process\u col\u best\u performin
函数调用更改为
process\u col\u best\u performing(1,'js datatable'));
。您只想通过
js
函数参数传递值数据,不声明参数名称和值,只需在函数参数中设置所需的传递值。不,这不起作用。请提供一个,以便我们可以轻松运行它并查看错误。如果您在正在使用的表中添加了,则可以创建一个runn可编程代码示例。除了@joshmoto所说的(如果它解决了你的问题或没有,这肯定是你会遇到的另一个问题),这必须在另一个环境中复制,但我们没有所有的上下文。我在第一篇文章中添加了htmltable代码。
var cols_qty = document.getElementById ('js-datatable').rows[0].cells.length
var i;
for(i = 1; i < 4; i++) {
    console.log(i)
    process_col_best_performing(tbl_col=i,'js-datatable');
}