2011-02-12 3 views
0

jQuery의 펄스 기능을 호출하는 함수가 있습니다. 클라이언트 인터페이스의 작은 그래픽에서 일부 데이터가 서버와 동기화되는 과정에 있음을 나타냅니다. 데이터가 전송되는 동안 펄스 기능이 적용되어 그래픽이 깜박 거리는 것처럼 보입니다.다른 자바 스크립트 액션이 실행되지 않는 이유는 무엇입니까?

작은 표시기 그래픽과 더불어 일부 텍스트입니다. 따라서 동기화가 완료되면 펄스가 중지되고 그래픽이 녹색으로 바뀌며 텍스트에 "데이터가 동기화되었습니다"라고 표시됩니다.

필자가 이해할 수없는 이유로 펄스 효과를 중지하는 기능은 약 50 %의 시간 동안 작동합니다. 그러나 "데이터 동기화 됨"이라고 말하도록 변경되는 텍스트는 100 % 작동합니다.

코드에서 두 작업이 모두 실행되는 지점까지 어떻게 도달 할 수 있습니까? 실제로 하나만 실제로 발생합니다. 나에게 그들은 둘 다 일하거나 둘 다 실패해야한다. (나는 그들의 질서를 바꾸려고 노력했지만 그 문제에 어떤 영향도 미치지 않는다.)

다음은 문제의 코드이다. 첫 번째 함수는 데이터 동기화가 시작될 때 실행되고, 다른 함수는 서버가 "all good : data synchronized"라는 JSON을 보내면 실행됩니다.

참고로, 나는 일종의 멍청이니까, 제발 내 수준에 대한 대답을 멍청하게하십시오.

function syncDataStart() 
{ 
    $(document.getElementById("indicator")).pulse(
    { 
     backgroundColor: ["yellow", "orange"] 
    }, 100, 9999, "linear"); 
    document.getElementById("indicator-text").innerHTML = "synchronizing data"; 
} 

function syncDataComplete() 
{ 
    document.getElementById("indicator-text").innerHTML = "data synced"; 
    $(document.getElementById("indicator")).stop(); 
    document.getElementById("indicator").style.backgroundColor = "green"; 
} 
+3

왜 $ (document.getElementById ("indicator"))가 아닌가? ("# 지시자") 이유가 무엇이겠습니까? –

+0

당신은 포함하지 않은 코드를 작성했습니다. 코드의 관련 부분 - 중요한 여기에는 실제로는이 두 함수를 호출하는 코드가 있지만 함수 자체는 아닙니다 –

+0

# 문자를 사용하면 코드가 완전히 손상됩니다. 또한 두 함수를 호출하는 코드가 왜 관련이 있는지 알 수 없습니다. 중요한 점은 함수가 호출되고 함수에서 어떤 일이 발생해야하는지입니다. 함수를 호출하는 코드가 어떻게 반 실행되는지를 나에게 설명 할 수 있다면 관련성을 알 수있을 것이다. – Questioner

답변

1

좋습니다. 이번에는 확실히 해결했습니다.

문제는 stop() 메소드가 아니라 펄스가 시작된 방법과 함께 나타납니다. 나는 그것을 이해하려고 시도하고 설명 할 것이며, 비슷한 이슈를 가진 사람들에게 도움이되기를 바랍니다.

내 실수는 이름이 지정된 요소 (내 경우에는 #indicator div)에서 펄스 애니메이션을 시작했을 때 그 펄스 효과가 단순히 "켜기"였고 간단히 꺼질 수 있다고 가정했습니다.바이너리라고 가정했는데, 버튼 요소를 활성화하거나 비활성화 할 수있는 방법과 같은 종류였습니다. 두 번째 비활성화하면 아무 것도하지 않겠습니다.

그러나 실제로 펄스 효과는 누적됩니다. 즉, 동일한 요소에 펄스 효과를 호출하면 기존 요소 위에 또 다른 펄스가 추가됩니다.

제 인터페이스에는 표시기 펄스 효과를 켤 수있는 몇 가지 위젯이 있습니다. 내가 어떤 일이 일어나고 있는지 알지 못하는 이유는 특정 환경에서 달리기 펄스 위에 새로운 펄스 효과를 추가하기 때문입니다.

stop() 메서드를 호출하면 실행중인 펄스 효과 중 하나가 중지되었을 가능성이 있지만 다른 일부는 계속 실행되어 마치 펄스 효과가 계속해서 진행되는 것처럼 보입니다. ("모든 실행중인 애니메이션 중지 ..."라고하는 코드가있는 경우 유용 할 수 있습니다.

단순히 펄스 효과가 있는지 여부를 나타내는 값을 저장하는 변수를 추가했습니다. 그런 다음 새로운 펄스를 시작하지 마십시오. 그러면 한 번에 하나의 펄스 효과 만 발생하고 stop() 메서드는이를 제거 할 수 있습니다.

감사의 말을 전하는 데 감사드립니다.

0

편집 :

사용하여 시도 .stop(true,true) 같은 귀하의 제공된 코드 제임스 Padolsey의 펄스 플러그인과 존 레식의 색상 PLU와 함께 작동

$(document.getElementById("indicator")).stop(true,true); 또는

$("#indicator").stop(true,true);

+0

이것은 문제를 해결하지 못하는 것 같습니다. 사실, 바인딩을 해제하면 펄스가 멈추지 않습니다. 또한 # 문자를 사용하면 Javascript가로드되지 않아 Firebug에서 요소를 찾을 수 없다는 오류가 표시됩니다. – Questioner

+0

그건 질문과 관련이 없으므로 OP가 애니메이션 플러그인을 사용하고 있다는 것이 확실하므로 효과 대기열을 지우는'.stop()'을 사용하는 것이 정확해야합니다. –

+0

@ Yi Jiang - 네가 쓰고있는 ... – Rafay

0

gin on my test page.

코드는 document.getElementByID ("indicator")와 "#indicator"와도 완벽하게 작동합니다. 해시를 사용하면 내 페이지가 이상하게 보일 것입니다. 코드의 다른 부분에서 오류를 찾습니다.

  • 표시 요소 요소에 액세스하는 다른 방법이 있습니까?
  • 어떤 플러그인을 사용하고 있습니까? 관련성이있는 자신을 작성 했습니까?
  • JQuery의 DOM 탐색을 방해하거나 방해하는 것이 멋진가요?

행운을 빈다.

관련 문제