Question

我当前有jQuery动画的问题...这是我正在做的事情......我有四个多选菜单，当我改变时我希望将所选值放在一个有4个不同tbody标签的表中（我用ID制作的唯一区域。我需要4个不同的tbody区域的原因是由于我显示的数据的性质，它必须按照一定的顺序。无论如何，我的真正问题是，当用户更改或修改我希望捕获事件的菜单的值时，确定单击了哪个菜单，获取其值（或值）并在表的相应部分中显示它。现在要时髦（并且由于与选择相关的规则），我希望淡出前面的菜单选择并淡入新的选择。

我已经删除了我的代码以及我的工作但是每次运行该功能时新内容都会重复两次（或单击其中一个选择菜单）。旧的内容简单地消失了，新的内容然后淡入...但是不是1行我有2.新的时间我运行它我的内容淡出然后创建了4个新行。这是我所拥有的最小化版本...为什么内容重复，我是愚蠢还是什么？

$(document).ready(function() {
    changeTable();
});


  function changeTable(){

    var selectArray = ["cat", "catOpt", "tariff", "tariffOpt"], // these are the IDs of the select menus...
        i;

    for(i=0;i<selectArray.length;i++){
        $("#" + selectArray[i]).click(function () {
            if(this.id == "cat"){
                $('#dynamicTableHolder #dtCats').find("td").fadeOut(1000, function(){ 
                    $(this).parent().remove(); // due to problems with jQuery we have to fadeOut the TDs then remove the TR
                    $('#dynamicTableHolder #dtCats').append('<tr><td>'  + $("#cat").val() + '</td><td></td></tr>').hide().fadeIn(1000); // Now let's fade in some new content
                });
            }
        }); 
    }       
  }

这是一个JSfiddle所以你可以看到问题......

http://jsfiddle.net/itakesmack/xKZfr/1/

Answer 1

你的问题在于这一行：

$('#dynamicTableHolder #dtCats').find("td")

这是找到多个td，因此您的代码按td ...

执行

您可以尝试这种方法 - 这会替换表格中的当前行：http://jsfiddle.net/xKZfr/2/

内容与jQuery fadeIn / fadeOut重复

1 个答案: