簡單的onclick事件不起作用

我已經用html，css和javascipt進行了相當簡單的設置。當用戶點擊其中一個div時，它應該出現或消失，以及將隱藏表單字段設置爲「1」或「0」。簡單的onclick事件不起作用

首先，CSS：

div.hidden{ 
    visibility: hidden; 
} 
div.shown{ 
    visibility: visible; 
}

的javascript：

function toggle(id){ 
    if (document.getElementById("h"+id).value=="0"){ 
     document.getElementById("h"+id).value="1"; 
     document.getElementById("i"+id).className='shown'; 
    } 
    else{ 
     document.getElementById("h"+id).value="0"; 
     document.getElementById("i"+id).className='hidden'; 
    } 
}

和HTML：

<html> 
    <head> 
    <script src="foo.js"> 
    </script> 
    </head> 
    <body> 
    <form action="blah blah" > 
    <div class="hidden" id="i0" onclick="toggle(0);" > 
     <!--some image --> 
     <input type="hidden" id="h0" name="0" value="0" /> 
    </div> 

    <div class="hidden" id="i1" onclick="toggle(1);" > 
     <!--some image --> 
     <input type="hidden" id="h1" name="1" value="0" /> 
    </div> 

    <!-- etc --> 
    </form> 
    </body> 
</html>

我知道的JavaScript鏈接正確和可操作性，因爲當我打電話功能通過鉻的控制檯，它完美的作品，並做我的期望。但是，當我點擊這個div時，它不起作用！

我在做什麼錯？

來源

2011-09-03 Matthew Sainsbury

您的div最初是隱藏的（class="hidden"），所以當您運行該頁面時您將看不到任何內容，並且無法點擊它們。你也有錯別字（沒有onlick事件，但:-)）：

onlick="toggle(1);"

也許應該是：

onclick="toggle(1);"

來源

2011-09-03 10:02:18

你死定了。如果div被隱藏，雖然頁面上仍有空間，但它不會對用戶輸入做出反應。謝謝！ –

ID不能以數字開頭。這是一個規範。

試試這樣說：

function toggle(id){ 
    if (document.getElementById(id).value=="0"){ 
     document.getElementById(id).value="1"; 
     document.getElementById("i"+id.substr(1)).className='shown'; 
    } 
    else{ 
     document.getElementById(id).value="0"; 
     document.getElementById("i"+id.substr(1)).className='hidden'; 
    } 
}

<html> 
    <head> 
    <script src="foo.js"> 
    </script> 
    </head> 
    <body> 
    <form action="blah blah" > 
    <div class="hidden" id="i0" onclick="toggle('t0');" > 
     <!--some image --> 
     <input type="hidden" id="t0" name="0" value="0" /> 
    </div> 

    <div class="hidden" id="i1" onclick="toggle('t1');" > 
     <!--some image --> 
     <input type="hidden" id="t1" name="1" value="0" /> 
    </div> 

    <!-- etc --> 
    </form> 
    </body> 
</html>

來源

2011-09-03 09:58:56

謝謝，但它並沒有解決我的問題 –

還有一個錯字。的onclick。 –

我的兩個解決方案組合應該可以工作。只需複製並粘貼代碼。 –

你必須設法舔你的元素沒有點擊，也許那會工作。或者將onlick改爲onclick。

來源

2011-09-03 10:00:09 codez

哈哈。謝謝XD。但點擊也不起作用 –

您正在設置隱藏元素上的事件，我認爲它並沒有做任何事情。

來源

2011-09-03 10:01:02

簡單的onclick事件不起作用

回答

相關問題