Question

我的程序的基本结构是用php创建表，两个脚本：specialFunc（用于动态索引和添加行）以及排序脚本。

我的目标是要有一个表，在每一行中都有一个按钮，用于在单击的行和下一个行之间打开新行“ TEXT INFO”。多次单击同一按钮没有任何反应（我稍后会讲）。

在零行中，当没有任何按钮被单击时，我具有应执行的排序功能。单击任何按钮，然后进行排序，首先删除“文本信息”，然后对行进行排序。确实可以做到，但是即使在排序脚本中的任何地方都没有调用addRow（）函数，也是如此。

能否请您解释一下发生了什么？我从朋友那里得到了这种排序脚本，他可能是从互联网上获得的，我无法理解这些嵌套功能以及此脚本含义中的“ this”关键字。

关于按钮单击不止一次：您将看到创建了“ temp”变量-这样做是因为必须欺骗JS，因为他不想使用if(rIndex == (currPos - 1)) { continue}来执行自身。

我尝试使用console.log打印进行调试，正如您将在视频中看到的那样，一切都很好，但是通过日志我们可以看到何时调用sort，即使不调用，也可以调用addRow。排序脚本中的任何地方。

<?php
$provider = "Test_provider";
echo '<table id="my-table">';
echo '<tr><th id="sort11">Sort A</th><th id="sort11">Sort B</th><th id="sort11">Sort C</th></tr>';
for($counter = 1; $counter <= 11; $counter++){
    $provider = "Test_provider";
    echo' <tr id ="'.$counter.'"><td><button onclick="specialFunc()">'.$provider.'</button></td><td>Row '.$counter.' Col '.$counter.'</td><td>Row '.$counter.' Col '.$counter.'</td></tr>';
}
echo '</table>';
?>
<<script>
isFirst = true;
function addRow(rIndex) {  
            var currPos = rIndex;
            let tableRef = document.getElementById("my-table");
            let newRow = tableRef.insertRow(rIndex);
            newRow.id = "open row"
            let newCell = newRow.insertCell(0);
            newCell.colSpan = 3;
            let newText = document.createTextNode('TEXT INFO');
            newCell.appendChild(newText);
            newRowNumb = document.getElementById("open row").rowIndex;
            console.log("printing info at the moment of creating row, index of info row" + newRowNumb);
}
function specialFunc(){ 
var testTable = document.getElementById("my-table"),rIndex,cIndex;
for(var i = 0; i < testTable.rows.length; i++)
{

    for(var j = 0; j < testTable.rows[i].cells.length; j++)
    {
        testTable.rows[i].cells[j].onclick = function()
        {
            rIndex = this.parentElement.rowIndex;
            cIndex = this.cellIndex;
            //console.log(rIndex,cIndex);
            if (isFirst){
                    rIndex = rIndex+1;

                    addRow(rIndex);
                    console.log("new row first call :" + newRowNumb);
                    isFirst = false;
                    currPos = rIndex;
                    //console.log("row index:" + rIndex);
            }
            else{
                    if(rIndex == (currPos - 1))
                        temp=1
                    else{

                        document.getElementById("my-table").deleteRow(currPos);
                        addRow(rIndex);
                        console.log("new row second call and more:" + newRowNumb);
                        currPos = rIndex;
                    }
            }   
        }
        };
    }
};


</script>

<script>
function delRowWhenSorted(_newRowNumb){ 
        console.log("del row sort func :" + newRowNumb);
        document.getElementById("my-table").deleteRow(newRowNumb);
}
    //var table = $('table');
    var table = $('#my-table');
    $('#sort11,#sort12,#sort13')
        .each(function(){

            var th = $(this),
                thIndex = th.index(),
                inverse = false;

            th.click(function(){    
                if (typeof newRowNumb != "undefined") {
                    delRowWhenSorted(newRowNumb);
                }
                table.find('td').filter(function(){

                return $(this).index() === thIndex;


                }).sortElements(function(a, b){

                    return $.text([a]) > $.text([b]) ?
                        inverse ? -1 : 1
                        : inverse ? 1 : -1;

                }, function(){                    
                    // parentNode is the element we want to move
                    return this.parentNode; 

                }); 

            });

        });

为什么我的脚本执行的功能甚至没有被调用？

0 个答案: