0

我有这个 javascript，用于将项目添加到五列之一。问题是当我单击添加按钮时，它会将一个新项目添加到当前列（目标），以及已经存在的每个项目。

首先是代码。

//adds the html code underneath the column. Get's called on document ready.
function populateTable(){
    for (var i = 0; i < 5; i++)
        $("#maintable .control .c"+i)
            .append('<a href="#" class="add" onclick="addItem('+i+')">Add</a>');
}
//...
//and the function called onclick
function addItem(c,r,doRet,target){
    if(target == undefined)
        target = $("#maintable .schedtab .c"+c).get();
    if(r == undefined){
        r = $(target).find(".item").length + 1;
    }
    var $item = $('<div class="item cell' + cellAddress(c,r) + '"></div>');
    $item.append('<input type="text" class="packers"></input>');
    $item.append('<input type="text" class="cartons" ></input>');
    $item.append('<input type="text" class="count"></input>');
    $item.focusin(showCartonsSelect);
    $item.mouseenter(showCP);
    $item.mouseleave(hideCP);
    if(doRet) return $item;
    var $targ = $(target);
    $targ.append($item);
}

这是html：

<table class="schedule">
    <tr class="schedtab">
        <td class="col c1"></td>
        <td class="col c2"></td>
        <td class="col c3"></td>
        <td class="col c4"></td>
        <td class="col c5"></td>
    </tr>
    <tr class="control">
        <td class="c1"></td>
        <td class="c2"></td>
        <td class="c3"></td>
        <td class="c4"></td>
        <td class="c5"></td>
    </tr>
</table>

编辑：好的，这是一个更新。当我单击触发 addItem(1) 的添加按钮时，它会生成一个新的“项目”，然后将其添加到目标和已经存在的每个项目。每个项目都是一个具有“.item”类的 div。它只应该将新项目添加到目标，而不是已经存在的每个项目。

4

2 回答 2

0

如果我理解正确，也许如果您更改$targ.append($item)for$targ.html($item)将解决您的问题。

正如您所说：“它将一个新项目添加到当前列（目标），以及已经存在的每个项目。”

那是因为append()添加内容会留下元素的现有内容。 .html()插入和替换任何以前的内容。

于 2013-04-28T00:21:15.067 回答
0

我的错误:) 问题是单元格地址返回A1 c1 r1含义Cell A1, Column 1, Row 1。因此，它将新项目添加到具有 class 的每个 div 中c1，这意味着将其附加到列中的每个现有项目以及列本身。无论如何，谢谢你的帮助。它没有在小提琴中这样做的原因是我没有包含单元格地址功能。

所以这是显示问题的更新小提琴：http: //jsfiddle.net/Arlen22/uzPDU/2/

更新后的代码是：target = $("#maintable .schedtab .col.c"+c).get();

于 2013-04-29T23:38:38.217 回答