15
4

8 に答える 8

21

onclick同じ関数呼び出し内での動作を変更しようとしています。次のようにしてみてください。

アンカータグ

<a id="loginLink" onclick="toggleTable();" href="#">Login</a>

JavaScript

function toggleTable() {
    var lTable = document.getElementById("loginTable");
    lTable.style.display = (lTable.style.display == "table") ? "none" : "table";
}
于 2013-03-29T06:38:05.337 に答える
7

jqueryを使ってシンプルに

<script>
$(document).ready(function() {
    $('#loginLink').click(function() {
    $('#loginTable').toggle('slow');
    });
})
</script>
于 2013-03-29T06:41:03.273 に答える
4

関数を次のように変更する必要があります。

function toggleTable()
{
   if (document.getElementById("loginTable").style.display == "table" ) {
       document.getElementById("loginTable").style.display="none";

   } else {
      document.getElementById("loginTable").style.display="table";

}

現在、パラメーターに基づいてチェックしてbooleanいるため、関数でパラメーターを渡す必要はありません。

アンカー タグを次のように変更する必要があります。

<a id="loginLink" onclick="toggleTable();" href="#">Login</a>
于 2013-03-29T06:37:55.123 に答える
2

toggleTableこの行を実行すると、関数内で

document.getElementById("loginLink").onclick = toggleTable(....

実際に関数を再度呼び出しています。sotoggleTableが何度も呼び出され、無限の再帰呼び出しに陥っています。

それを簡単に。

function toggleTable()
{
     var elem=document.getElementById("loginTable");
     var hide = elem.style.display =="none";
     if (hide) {
         elem.style.display="table";
    } 
    else {
       elem.style.display="none";
    }
}

このフィドルを参照してください

于 2013-03-29T06:44:04.863 に答える
1

アンカー タグは次のようにする必要があります。

  <a id="loginLink" onclick="showHideTable();" href="#">Login</a>

そしてあなたのJavaScript関数：

function showHideTable()
{
   if (document.getElementById("loginTable").style.display == "none" ) {
       document.getElementById("loginTable").style.display="";

   } else {
      document.getElementById("loginTable").style.display="none";

}
于 2013-03-29T10:22:40.650 に答える
0

常に true を toggleMethod に渡しているため、常にテーブルが「表示」されます。代わりに、トグル メソッド内で反転できるグローバル変数を作成します。

または、明示的な変数の代わりにテーブルの可視性の状態を確認できます

于 2013-03-29T06:38:02.977 に答える
0

試す

<script>
  function toggleTable()
    {

    var status = document.getElementById("loginTable").style.display;

    if (status == 'block') {
      document.getElementById("loginTable").style.display="none";
    } else {
      document.getElementById("loginTable").style.display="block";
    }
  }
</script>
于 2013-03-29T06:42:51.657 に答える