하여 setInterval은 이모티콘 기능을 가지고 있지 않기 때문에 제대로

Question

이 모두 무엇에 대한

나는 현재 캠프 파이어 채팅 서비스에 이모티콘을위한 스크립트 작업입니다 작동하지 않습니다. 지금 채팅에서 새 메시지가있는 경우 200 밀리 초를 확인하는 setInterval을 사용하기 때문에 이모티콘은 실제로 천천히 실행됩니다. 나는 두 변수 "a"와 "b"를 var a,b;으로 만들어 이것을합니다. 그래서 첫 번째 setInterval에서 나는 밀리 세컨드로 시간을 잰다. 이 내부에서 저는 채팅의 HTML 값을 변수 "a"에 제공합니다. 그런 다음 두 번째 setInterval (200)에서 "b"변수에 HTML 값도 지정하지만 이것은 다른 타이밍이므로 if 문에서 HTML을 확인하고 심볼이 다른 경우에는 심볼을 변경하는 함수를 실행합니다 이모티콘으로. 성능 향상을 위해이 작업을 수행했습니다. 캠프 파이어 채팅에 아무도 실제로 뭔가를 써서 이모티콘을 확인할 필요가 없더라도 이모티콘을 확인하기 전에. 당신이 위의 코드에서 볼 수 있듯이

var a, b; 
setInterval(function() { 
    a = $('#chat').html(); 
    console.warn("Chat HTML has been Scanned"); 
}, 150); 
var t = "0"; 
setInterval(function() { 
    b = $('#chat').html(); 
    console.warn("Chat got scanned for Change in html."); 
    if (emoOn == true) { 
     if (t === $('#num12345').text()) { 
      $(".participants").after('<div id="emote"><h3><span class="room_actions"><a href="javascript:void(0)" class="on" style="font-weight:bold;">On</a> | <a href="javascript:void(0)" class="off" style="cursor:pointer;">Off</a></span>Emoticons</h3></div>'); 
      $('#num12345').text("111") 
     } 
     if (a !== b) { 
      turnOn(); 
      console.log("CHANGE") 
     } else { 
      turnOn("off"); 
     } 
    } 
}, 200)​; 

문제

내가 3 개 콘솔을 실행

이 완전한 기능입니다. 콘솔에서 나는 "Chat HTML has Scanned"경고가 올 것으로 예상하고 "Chat in html의 변경 사항을 검사했습니다." 그 순서대로. 하지만 대신 "채팅 HTML이 스캔되었습니다"라는 경고 문구가 두 번 표시됩니다. 제대로 작동하지 않는 것처럼 보입니다.

새 메시지가 "변경"을 로그한다고 가정하지만 대부분의 시간은 그렇지 않습니다. 그리고 나는 그것이 setIntervals의 문제라고 생각합니다. 타이밍이 맞지 않는 것 같습니다. 하지만 JavaScript가이 문제를 일으키고 있다고 말하고 싶지는 않지만 그 밖의 무엇이 될지 모르겠습니다. 또한 Chrome을 사용하고 있습니다.

Answer 1

setInterval은 비동기식이므로 첫 번째 호출이 대기 중이면 자바 스크립트 인터프리터는 다음 작업으로 이동합니다 (이 경우 t를 "0"으로 설정하고 두 번째 setInterval 호출).

편집 : 문제는 setInterval 호출을 동시에 정의하는 것입니다. 그러나 자바 스크립트 타이머의 정밀도는 그리 좋지 않습니다 (여기를 참조하십시오 : http://ejohn.org/blog/accuracy-of-javascript-time/ 참조). 당신이 멀리 얻을 수, 이것은 두 번째 전화를 설정합니다

var a, b; 
setInterval(function() { 
    a = $('#chat').html(); 
    console.warn("Chat HTML has been Scanned"); 
    var t = "0"; 
}, 2000); 
setTimeout(function(){ 
    setInterval(function() { 
     b = $('#chat').html(); 
     console.warn("Chat got scanned for Change in html."); 
     if (emoOn == true) { 
      if (t === $('#num12345').text()) { 
       $(".participants").after('<div id="emote"><h3><span class="room_actions"><a href="javascript:void(0)" class="on" style="font-weight:bold;">On</a> | <a href="javascript:void(0)" class="off" style="cursor:pointer;">Off</a></span>Emoticons</h3></div>'); 
       $('#num12345').text("111") 
      } 
      if (a !== b) { 
       turnOn(); 
       console.log("CHANGE") 
      } else { 
       turnOn("off"); 
      } 
     } 
    }, 2000)​; 

}, 500); 

이 첫 번째 후 0.5 초를 setInterval을 위해 :

당신은 자신에게 버퍼의 비트를 제공하기 위해에서는 setTimeout 후 두 번째 setInterval을 호출 할 수 있습니다 30ms 이상이면 충분할 것입니다.