Question

我重新使用了一个常见的addRow函数，但是我的基本js技能限制了我对代码进行大的修改。

这个优雅的功能有效，但是我希望新行中的所有元素都具有与前一行不同的名称。一位朋友提议使用

var new_name = old_name.replace(rowCount, rowCount+1); //by using a counter

，所以在下面的例子中让新创建的行包含元素“username_2”和“email_2”

谢谢！

<INPUT TYPE="text" NAME="username_1"> : name <BR>
<INPUT TYPE="text" NAME="email_1"> : email <BR>

function addRow(tableID) {
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    var colCount = table.rows[0].cells.length;

    for(var i=0; i<colCount; i++) {
        var newcell = row.insertCell(i);
        newcell.innerHTML = table.rows[0].cells[i].innerHTML;
        //alert(newcell.childNodes);
        switch(newcell.childNodes[0].type) {
            case "text":
                    newcell.childNodes[0].value = "";
                    break;
            case "checkbox":
                    newcell.childNodes[0].checked = false;
                    break;
            case "select-one":
                    newcell.childNodes[0].selectedIndex = 0;
                    break;
        }
    }
}

Answer 1

要让新创建的行包含“username_2”和“email_2”元素，您需要使用以下代码替换现有函数。

function addRow(tableID) 
{  
   var table = document.getElementById(tableID);  
   var rowCount = table.rows.length; 
   var row = table.insertRow(rowCount);  
   var colCount = table.rows[0].cells.length;  
   for(var i=0; i<colCount; i++) 
   {  
       var newcell = row.insertCell(i);  
       //alert(newcell.childNodes); 
       newcell.innerHTML = table.rows[0].cells[i].innerHTML; 
       if(newcell.childNodes[0]!=null && newcell.childNodes[0].name != null)
       {
           var oldName =newcell.childNodes[0].name;
           var newName = getNewName(oldName,rowCount+1 );
           newcell.innerHTML = replaceAll(newcell.innerHTML,oldName, newName);
       }

       switch(newcell.childNodes[0].type) { 
         case "text": 
            newcell.childNodes[0].value = ""; 
            break; 
         case "checkbox": 
            newcell.childNodes[0].checked = false; 
            break; 
         case "select-one": 
            newcell.childNodes[0].selectedIndex = 0; 
            break; 
      } 
   } 
}

 function replaceAll(inputString, regExpr, newString)
 {
    var outputStr = "";
    var pivot;
    while(inputString.indexOf(regExpr) != - 1)
    {
        inputString = inputString.replace(regExpr,newString);
        pivot = inputString.indexOf(newString) + newString.length;
        outputStr = outputStr + inputString.substring(0, pivot) ;
        inputString = inputString.substring(pivot,inputString.length);
    }
    outputStr = outputStr + inputString;
    return outputStr;
 }

 function getNewName(oldName,rowIndex )
 {
      var arr = oldName.split('_');
      arr[arr.length - 1] = rowIndex;
      var str = "";
      for (arrIndex = 0; arrIndex < arr.length; arrIndex++)
      {
           str += arr[arrIndex];
           if (arrIndex != arr.length - 1)
           {
                 str += "_";
           }
      }
      return str;
 }

JavaScript将不同的行添加到表-addRow函数中

1 个答案: