为什么我的代码循环两次？

我正在制作一个数据可视化工具，您可以在其中输入自己的数据。数据值存储在如下的无序列表中：<ul><li data-name='name'><a href='#' onclick='showEditDv(this);'>Edit</a>name | 7</li></ul。列表中可以有多个列表项。当你点击编辑按钮时，它会调用showEditDv()函数，给自己一个参考。在我展示的功能，我会说，data对象是这样安排：为什么我的代码循环两次？

data -> 
    name: "root", 
    children: [ {name: "something", size: "7"}, 
     {name: "something-else", size: "999"} ]

这是函数的代码：

function showEditDv(object) { 
    var name = $(object).parent().attr("data-name"), 
     input = new Opentip($(object), {removeElementsOnHide: true, target: null, showOn: null, hideTrigger: "closeButton"}), 
     disabled = (data.children[getChildIndexByName(name)].hasOwnProperty("children")) ? "disabled" : ""; 

    input.setContent("<label>Name:</label><input type='text' data-prevname='" + name + "' value='" + name + "' class='dv-add-name' /><label>Value:</label><input " + disabled + " type='text' class='dv-add-value' value='" + data.children[getChildIndexByName(name)].size + "' /><button class='callEditDv'>Apply</button>"); // Set content of opentip 

    input.show(); 

    $("body").on("click", ".callEditDv", function() { 
     var newname = $(this).siblings(".dv-add-name").val(), 
      prevname = $(this).siblings(".dv-add-name").attr("data-prevname"), 
      value = $(this).siblings(".dv-add-value").val(); 

     if (newname !== prevname) 
     { 
      data.children[ getChildIndexByName(prevname) ].name = newname; // Update name 

      $(object).parent().attr("data-name", newname); // Update parent data 

      $(object).siblings(".name").text(newname); // Update form 
     } 

     if (data.children[ getChildIndexByName(newname) ].size !== value) 
     { 
      data.children[ getChildIndexByName(newname) ].size = value; 
      $(object).siblings(".value").text(value); 
     } 
     input.hide(); 
    }); 
}

它采用Opentip，这仅仅是一个的方式创建动态弹出窗口/工具提示。问题在于，一旦您更改了一次数据值，当您尝试再次更改它时，它会遍历代码两次！第一次一切按预期工作，但第二次再次使用时，使用相同的prevname，这意味着getChildIndexByName返回undefined并且它不能设置导致错误的变量。 getChildIndexByName通过检查名称的值data.children循环直到找到匹配，然后返回数组中的对象的索引。

在此先感谢！

来源

2013-04-05 microbug

尝试此：使用带有.bind（）可以与被移除.unbind（）

$("body").off('click').on("click",...

jQuery Documentations

事件处理程序。（在jQuery 1.7中，。对（）和.off（）方法是优选的，以附着和上元件移除事件处理程序。）

来源

2013-04-05 09:29:54

这也有用，谢谢！ – microbug 2013-04-05 09:33:17

很高兴帮助！ – 2013-04-05 09:34:59

变化：

$("body").on("click",...

到

$("body").unbind('click').on("click",

希望这有助于！

来源

2013-04-05 09:24:39

由于*所以*多！ – microbug 2013-04-05 09:26:58

为什么我的代码循环两次？

回答

相关问题