2010-02-09 6 views
2

최근에 저는 기존 프로젝트를 유지하고 있습니다. 한 자바 스크립트 죽은 루프 문제를 페이지에서 발견했다. 데모 코드는 다음과 같습니다. 사용자가 첫 번째 입력 상자를 클릭하고 3을 입력 한 다음 두 번째 입력 상자를 직접 클릭하면 데드 루프가 발생합니다. 이제 내 질문은 이런 종류의 문제를 해결하거나 예방하는 가장 좋은 방법은 무엇입니까? 대단히 감사합니다.이 자바 스크립트 죽은 루프를 해결하는 가장 좋은 방법은 무엇입니까?

if(b.value.length < a.value.length){ 

또는 검사 할 경우가 동일인지 아닌지 : 당신이 길이를 비교하는 경우

if(b.value < a.value){ 

, 이렇게 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
</head> 
<body> 

<input type="text" name="a" id="a" value="" /> 
<input type="text" name="b" id="b" value="" /> 

<script type="text/javascript" charset="utf-8"> 
var a = document.getElementById("a"); 
a.onblur = function(){ 
    if(a.value.length === 1){ 
     alert("aaa"); 
     a.focus(); 
     a.select(); 
     return false; 
    } 
} 

var b = document.getElementById("b"); 
b.onblur = function(){ 
    if(b.value < a.value){ 
     alert("bbb"); 
     b.focus(); 
     b.select(); 
     return false; 
    } 
} 
</script> 
</body> 
</html> 
+1

'a'에 두 개 이상의 문자가 포함되어 있고 'b'에 'a'에있는 문자보다 큰 문자가 포함되어있는 것 같습니다. 당신은 어떤 종류의 큰지에 대해서도 매우 정확하지 않습니다. 'a'== 'aa'와 'b'= 'ab'가 테스트를 통과합니다. – meouw

+0

focus() 호출을 피하십시오. – Francisco

답변

1

이것은 IE에서 작동합니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 

<head> 
    <meta content="text/html; charset=utf-8" http-equiv="Content-type" /> 
</head> 

<body> 
    <input id="a" name="a" type="text" value="" /> 
    <input id="b" name="b" type="text" value="" /> 

    <script charset="utf-8" type="text/javascript"> 
var bInBlurA = false; 
var a = document.getElementById("a"); 
a.onblur = function(){ 
    if (bInBlurB) return; 
    if(a.value.length === 1){ 
     bInBlurA = true; 
     alert("aaa2"); 
     a.focus(); 
     a.select(); 
    } 
} 

var bInBlurB = false; 
var b = document.getElementById("b"); 
b.onblur = function(){ 
    if (bInBlurA) return; 
    if(b.value < a.value){ 
     bInBlurB = true; 
     alert("bbb2"); 
     b.focus(); 
     b.select(); 
    } 
} 
a.onfocus = function() 
{ 
    bInBlurA = false; 
} 
b.onfocus = function() 
{ 
    bInBlurB = false; 
} 
    </script> 

</body> 
</html> 
0

유는이 선으로 무엇을 의미합니까 그 다음 :

if(b.value == a.value){ 

또는

if(b.value != a.value){ 
+0

안녕 Sarfraz, ** if (b.value

+0

정확히 무엇을하고 싶습니까? – Sarfraz

1

이 시도 : 의도 한대로 작동하지 않지만

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
</head> 
<body> 

<input type="text" name="a" id="a" value="" /> 
<input type="text" name="b" id="b" value="" /> 

<script type="text/javascript" charset="utf-8"> 
var a = document.getElementById("a"); 
a.onblur = function() { 
    a.validCheck = false; 
    if(a.value.length === 1){ 
     alert("aaa"); 
     a.focus(); 
     a.select(); 
     return false; 
    } 
    a.validCheck = true; 
} 

var b = document.getElementById("b"); 
b.onblur = function() { 
    if (!a.validCheck) return true; 
    if(b.value < a.value){ 
     alert("bbb"); 
     b.focus(); 
     b.select(); 
     return false; 
    } 
} 
</script> 
</body> 
</html> 

플러스 나는 파이어 폭스에있는 루프 문제가 발생하지 않았다. IE로만 가정합니다.

관련 문제