Question

我有一个jquery块，使用循环到.append（）div元素构建一个包含40个以上元素的表单，加载.ajax（）json。

表单呈现的10次中有9次符合预期。然而，随机的一些元素将遭受两种类型的错误

~~将创建dom元素但不显示（不显示在源代码中）~~（在更深入的调查中，似乎元素总是生成，只是错误的父元素（2））
dom元素作为子元素放置在错误的父元素上。

例如下面，id3应附加到delta[14]，而是生成于beta[3]或id3应位于gamma[6]，但不会显示在<div id="alpha"> <div id="beta"></div> <div id="gamma"></div> <div id="delta"></div> </div> doAppendStuff(beta, ajaxUrletc1); doAppendStuff(beta, ajaxUrletc2); ... doAppendStuff(gamma, ajaxUrletc10); doAppendStuff(gamma, ajaxUrletc11); ... doAppendStuff(delta, ajaxUrletc20); doAppendStuff(delta, ajaxUrletc21);所有

构建的格式是

硬代码

    function randId(baseID) {
        return baseID+"_"+Math.round(new Date().getTime() + (Math.random() * 555));
    }

    var id1= randId("myIdOne");
    var id2= randId("myIdTwo");
    var id3= randId("myIdThree");

    function doAppendStuff(elemId, ajaxUrletc){
    $('#' + elemId).append(
        '<div id="' + id1 + '" >' +
           '<div id="' + id2 + '">' +
              '<select id="' + id3 + '"></select>' +
            '</div>' +
        '</div>'
     );
    ... // log id1, id2,id3
    ... //do .ajax stuff + callback on id3

动态

return baseID+"_"+Math.round(new Date().getTime() + (Math.random() * 555));

我已经为每个循环添加了回调，以确保触发.append并且不会产生错误，抱怨该元素不存在。

运行跟踪我可以看到正在生成每个元素的动态ID。

代码本身按预期工作，与其预期的其他9/10次一样。

注释

随机错误每次都适用于不同的元素。没有关于哪个元素失败的特定逻辑。
我已将djax调用与dom元素创建分开，因此元素创建不应存在瓶颈
所有ajax调用按正确顺序按预期启动。有些需要更长时间，但其他元素无需等待即可按预期生成。所有数据都已成功返回。

通过重复调用相同的函数生成多个dom元素是否有任何已知问题？是否有一个监听器我可以添加以确保元素在所需位置正确生成，然后通过回调继续下一次调用。

更新

添加id1，id2，id3的日志记录后，日志会确认正在分配正确的动态ID。然而，似乎内存中的var被替换为先前的值，或者由于时间原因，js引擎被置于错误的生成位置。

更新2

经过一些调试后，我们更改了随机字符串并从

return baseID+"_"+Math.round(new Date().getTime() + (Math.random() * 99999));

到

Post

并且问题没有再发生。因此看起来它可能是随机ID冲突，同一个字符串被生成两次，或者在重新初始化函数时以某种方式重用。有趣的是，ID不是顺序的，在重复使用相同的ID之前，它通常会跳过几行。

所以我们已经解决了这个问题，但仍然不明白是什么导致了这个问题，欢迎任何想法。

Answer 1

如果你想要一个独特的价值，那么我们谈论的是GUID。

Create GUID / UUID in JavaScript?

但是，如果你在时间和随机数之间放置一个下划线或其他值，我怀疑你看到的碰撞次数减少了。

时间+随机=未来某段时间。

想象一下，获得一个随机的100，然后100毫秒后得到一个随机的0。

“abc1506110581013_100”！=“abc1506110581113_0”

，而

“abc1506110581113”==“abc1506110581113”

动态生成的jquery .append（）有时会附加到错误的div

1 个答案: