0

私はjavascriptに非常に慣れていないので、小さなスクリプトを書くという簡単な作業から始めました.トグルボタンのクリックによって文字列が表示されることを期待していた場所...

<!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 のみがクリックされたときにアラート ボックスが表示され、[OK] をクリックすると、プレーンな「Foo が押されました」だけが表示されます。表示する必要があります。トグルを 1 回クリックしてから foo をクリックすると、「トグルが true に設定されました。Foo が押されました」{このプロセスで 2 つのアラートが発生しました} が表示され、再びトグルが 2 回押されて foo が押されます。トグル フラグはトグルです。そして「Fooが押された」だけです。と表示されて続きますので……。

実際の結果: foo クリックのみが機能し、トグル クリックはまったく機能しません。

誰かがこれに光を当てることができますか?

4

1 に答える 1

2

名前が衝突しています。関数は変数toggleを置き換えtoggleます。これは、ECMAScript (Javascript) では、括弧を追加せずに関数を渡すことができるためです。つまり、関数はファーストクラスの市民です。

これに関する例:

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. " : "";
}

解決策は、関数または変数に別の名前を付けることです。

于 2013-04-16T12:38:58.027 に答える