Question

我目前正在运行一个循环来拉取数组的值，并且大部分都可以工作，但是当我添加第二个值时，它会将新值和先前值复制到表中。

所以当我添加一个值为488的行时，它可以正常工作：

<tr class="exe">
   <td class="sipname">1446033619.75</td>
   <td class="siptd">SIP/488-00000027</td>
   <td><button class="btn btn-default unmute" id="mute" type="submit">Unmute</button></td>
   <td><button class="btn btn-default kick" id="kick" type="submit">Kick</button></td>
</tr>

当我添加另一个值然后说487然后按顺序重复同一行488,488,487：

<tbody id="sip">
   <tr class="exe">
      <td class="sipname">1446033619.75</td>
      <td class="siptd">SIP/488-00000027</td>
      <td><button class="btn btn-default unmute" id="mute" type="submit">Unmute</button></td>
      <td><button class="btn btn-default kick" id="kick" type="submit">Kick</button></td>
   </tr>
   <tr class="exe">
      <td class="sipname">1446033619.75</td>
      <td class="siptd">SIP/488-00000027</td>
      <td><button class="btn btn-default mute" id="mute" type="submit">Mute</button></td>
      <td><button class="btn btn-default kick" id="kick" type="submit">Kick</button></td>
   </tr>
   <tr class="exe">
      <td class="sipname">1446033747.78</td>
      <td class="siptd">SIP/487-00000028</td>
      <td><button class="btn btn-default mute" id="mute" type="submit">Mute</button></td>
      <td><button class="btn btn-default kick" id="kick" type="submit">Kick</button></td>
   </tr>
</tbody>

所有我需要的是488,487的表行没有重复，当我刷新页面它工作正常。我正在使用socket.io（Express），node.js和Jquery。

我确实找到了一个使用jquery remove的小解决方法，但它影响了我的意思是一个小错误的功能，所以我需要不使用 jquery remove。

socket.on('sipname', function (data, datad) {
    var sipname = '';
    var sipid = '';
    $('.exe').remove();
    for (var i = 0; i < data.length; i++) {
        sipname = data[i];
        sipid = datad[i];
        if (sipname) {
            $sip.append('<tr class="exe">\
                                         <td class="sipname">' + sipid + '</td>\
                                         <td class="siptd">' + sipname + '</td>\
                                         <td><button class="btn btn-default mute" id="mute" type="submit">Mute</button></td>\
                                         <td><button class="btn btn-default kick" id="kick" type="submit">Kick</button></td>\
                                         </tr>');
        }
    }
});

任何想法或指导都会受到赞赏，这使我无法完成我的第一个应用程序版本。

Answer 1

1st：一次又一次ID必须是唯一的

第二：你可以试试这段代码..我把Ids改成了Class，所以一定要在你的css样式表中改一下..并在siptd类中使用data-sipname

socket.on('sipname', function (data, datad) {
    var sipname = '';
    var sipid = '';
    $('.exe').remove();
    for (var i = 0; i < data.length; i++) {
        sipname = data[i];
        sipid = datad[i];
        if (sipname) {
            if($('#sip > tr > .siptd[data-sipname = "'+sipname+'"]').length < 1){
            $sip.append('<tr class="exe">\
                   <td class="sipname">' + sipid + '</td>\
                   <td class="siptd" data-sipname="'+ sipname  +'">' + sipname + '</td>\
                    <td><button class="btn btn-default mute" type="submit">Mute</button></td>\
                    <td><button class="btn btn-default kick" type="submit">Kick</button></td>\
                                         </tr>');
         }   
      }
    }
});

希望有所帮助

Answer 2

看起来$sip是socket.on函数之外的＆＃34;全局＆＃34; -ish值。它会在第一个.on()调用中填充值，然后在第二个.on()调用中再次添加任何值。

修复的方法可能是：

仅向任何.on()功能发送新数据。这样，当你追加时，你就没有任何重复。
如果每次都完成.on()函数的数据，您可以在每次调用时清空$sip数组。 $sip = []，然后每次都附上新鲜的东西。
更复杂的选项是检查数组的每个元素以查看它是否存在。如果没有，请添加它，否则跳过它。使用哈希可以使这更容易，将ID存储为键，将HTML字符串存储为值。然后检查是否存在很快，!!$sip[ sipname ]（对象sipname中的属性$sip评估为true）。

从数组实时附加到表时停止重复值

2 个答案: