2013-04-16 4 views
0

토글 기능이 예상대로 작동하지 않는 이유는 무엇입니까?

<!DOCTYPE html> 
<html> 
<body> 


<button onclick="foo()">Foo</button> 
<button onclick="toggle()">Toogle</button> 
<p id="demo"></p> 


<script> 
    var toggle = false;//set the desired initial value to toggle flag 
    var x = ""; 

    function toggle() { 
     alert("ENTERED Toggle"); 
     toggle = !toggle; 
     x= toggle? "Toggle set to true. " : ""; 
    } 

    function foo() {`enter code here` 
     alert("ENTERED Foo"); 
     var y = "Food pressed"; 
     y = x + y; 
     document.getElementById("demo").innerHTML=y; // display the x value 
    } 
</script> 

</body> 
</html> 

가 예상 ... 나는 자바 스크립트 매우 새로운 오전과 내가 토글 버튼 클릭에 의해 영향을 표시 할 문자열을 기다리고 있었다 ... 작은 스크립트를 작성하는 간단한 작업 시작 : 때 foo 만 클릭하면 경고 상자가 표시되고 일반 "Foo pressed"만 클릭하면 '확인'을 클릭합니다. 표시되어야합니다. 한 번 토글을 누른 다음 foo를 클릭하면 "Toggle to true true Foo pressed"(이 프로세스에서 두 개의 경고가 발생 함)가 표시되고 두 번째로 Toggle을 누르고 foo를 누르면 토글 플래그가 전환됩니다 "Foo가 눌렀다." .....가 표시됩니다.

실제 결과 : foo 클릭 만 작동하고 클릭 전환이 전혀 작동하지 않습니다.

이 중 일부는 어떤 점을 밝힐 수 있습니까?

+0

여기에서 OK입니다. – PSR

+0

브라우저의 디버거를 아직 묻지 않으셨습니까? - IE의 경우 F12, FF, Chrome 및 Opera의 경우 Ctrl-Shift-I. – enhzflep

+1

[방법 ** 디버그 ** JavaScript] (http://www.netmagazine.com/tutorials/javascript-debugging-beginners)를 참조하십시오. –

답변

2

충돌하는 이름이 있습니다. toggle 함수는 toggle 변수를 바꿉니다. 이것은 ECMAScript (Javascript)에서 함수가 괄호를 추가하지 않고 전달 될 수 있기 때문입니다. 즉 함수는 first-class citizen입니다. 이것에

예 :

x = alert; //"x" is now the same function as "alert" 
x("Hej"); 

toggle 함수 내 정의이 과제에 따라서 동일하다 :

var toggle = function() { 
    alert("ENTERED Toggle"); 
    toggle = !toggle; 
    x= toggle? "Toggle set to true. " : ""; 
} 

용액 함수 나 변수의 다른 이름 중 어느 하나를 제공하는 것이다.

+1

Vikstrom : 정말 고마워요. 이제 작동합니다. 나는 같은 이름의 함수와 변수를 가질 수 없다는 것을 알지 못했다 ... –

관련 문제