动态添加的文本字段具有第一个文本字段的默认值

Question

我有一个脚本，我可以在其中使用“添加按钮”添加文本字段，但其余字段获取第一个字段的默认值。您可以查看demo here。只需在演示中的项目字段中输入 Apple，您将获得 69 的价格。然后，当您单击“添加项目”按钮时，它会为所有生成的价格字段提供默认值 69。我想显示新商品的空白价格字段。

我的脚本：

添加动态行

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;
                }
            $(function() {
              var availableTags = [
              "Apple",
              "Samsung",
              "Blackberry",
              "Nokia",
              ];
              $('input[name="item[]"]').autocomplete({
                  source: availableTags
              });
            });
            }
        }

获取商品价格脚本

function getXMLHTTP() { //fuction to return the xml http object
        var xmlhttp=false;  
        try{
            xmlhttp=new XMLHttpRequest();
        }
        catch(e)    {       
            try{            
                xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e){
                try{
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                }
                catch(e1){
                    xmlhttp=false;
                }
            }
        }

        return xmlhttp;
    }
      function getproduct(element) {      

        var strURL="getProduct.php?product="+element.value; 
        var req = getXMLHTTP();

        if (req) {

            req.onreadystatechange = function() {
                if (req.readyState == 4) {
                    // only if "OK"
                    if (req.status == 200) {   
                        // last changes here:
                        element.parentNode.parentNode.getElementsByClassName('productdiv')[0].innerHTML=req.responseText;                       
                    } else {
                        alert("There was a problem while using XMLHTTP:\n" + req.statusText);
                    }
                }               
            }           
            req.open("GET", strURL, true);
            req.send(null);
        }       
    }

getProduct.php 脚本：

<?php 
$product = $_GET['product'];
if($product == "Apple") {
    $value = 69;
} else {
    $value = 59;
}
?>
<input name="unit_price[]" value="<?php echo $value; ?>" onkeyup="getValues()" id="unit_price" placeholder="Price" />

Answer 1

伙计，你的问题在于：newcell.innerHTML = table.rows[0].cells[i].innerHTML;

无论如何，您总是将第一行值分配给新添加的项目