替换元素而不是追加

时间:2013-12-25 08:06:06

标签: jquery

我有以下代码,我需要用下拉选择中的新选项替换新创建的TD列。这是我的代码

$("#myselction").change(function(e) {
    var neData = $("#myselction").val();
    $("table.data thead tr").append("<th>Idea</th>");
    $("table.data tr:gt(0)").append("<td>" + neData + "</td>");
});

它正确地在表的末尾追加数据,但是每当我从下拉列表中选择新选项时,它会添加另一个td列,而不是我想用已经创建的列替换它,如果新的那个先创建它时间。

Alo我使用以下函数为奇数和偶数

添加/删除类
    zebRaRows('.data tbody tr:odd td', 'odd');
function zebRaRows(selector, className){
  $(selector).removeClass(className).addClass(className);
}

如何将上述内容添加到动态创建的列

3 个答案:

答案 0 :(得分:2)

你需要替换追加html()的append()替换。

尝试:

$("selector of element to replace").html("<td>" + neData + "</td>");

Here is fiddler for html demo

答案 1 :(得分:1)

您所希望的行为会有所不同,具体取决于是否是第一次采取行动。在这种情况下,有一个布尔标志,记录事件第一次发生。第一次,追加新的<td>;随后的时间,覆盖它。

jsFiddle

var firstTime = true;

$("#myselction").change(function(e) {
    var neData = $("#myselction").val();

    if (firstTime) {
        $("table.data thead tr").append("<th>Idea</th>");
        $("table.data tr:gt(0)").append("<td>" + neData + "</td>");
        firstTime = false;
    }
    else {
        $("table.data tr:gt(0) td:last-child").html(neData);
    }
});

答案 2 :(得分:0)

使用.html()创建新的。

$("table.data tr:gt(0)").html("<td>" + neData + "</td>");