html元素表單的條件顯示

那麼，在一個小時的javascript介紹之後，我想出了下面的代碼。它做了我想要的東西，但後來我想要別的東西，它不會工作。html元素表單的條件顯示

我想要點擊一個按鈕後，某個字段會隱藏，點擊另一個字段時，另一個字段也會隱藏起來，但是，當然，它必須讓另一個字幕顯示，否則我們會以沒有什麼，目的是根據用戶點擊的內容呈現不同的領域（在單選按鈕上）。因此，以幼稚的方式，我製作了自己的代碼並且工作正常。但是後來我發現，我希望首先隱藏兩個字段，而不是顯示兩個字段，這是問題所在。我向函數「告訴它」的參數添加了一個0值，當x = 0時，那麼visibility = hidden。但它不會聽我說的，所以，當x = 1和2表示x = 1時，代碼的一部分不起作用，而0則不起作用。

這是一個簡單的代碼，可以讓某人微笑，但嘿，它很乾淨，它的工作。有人在點擊按鈕之前知道如何隱藏這些字段嗎？

非常感謝我刪除HTML

<html> 
    <head> 
     <script language="javascript"> 
      var x = 0; 

      function hola(x) { 
       if(x == 0) { 
        document.getElementById("cont1").style.visibility="hidden"; 
        document.getElementById("cont2").style.visibility="hidden"; 
       } 

       if(x == 1) { 
        document.getElementById("cont1").style.visibility="visible"; 
        document.getElementById("cont2").style.visibility="hidden"; 
       } 

       if(x == 2) { 
        document.getElementById("cont1").style.visibility="hidden"; 
        document.getElementById("cont2").style.visibility="visible"; 
       } 
      } 
     </script> 
    </head> 

    <body> 
     <input type="button" onclick="hola(1)" value="hidefield2" id="boton1"> 
     <div id="cont1"> 
      <input type="text"> 
     </div> 

     <input type="button" onclick="hola(2)" value="hidefield1" id="boton2"> 

     <div id="cont2"> 
      <input type="text"> 
     </div> 
    </body> 
<html>

來源

2010-10-18 Alvaro

不要你認爲你應該實際**調用**作爲參數在某一點的功能？ – Pointy 2010-10-18 17:09:42

您好，感謝您花時間瀏覽我的問題。根據你的評論，我認爲我在一開始就這樣做了，我已經把x = 0，但現在你已經說了，我開始認爲這個變量沒有權力跨過開始的那一行函數，也就是說，函數可能不知道上面0到x行的分配。因此，如果默認是自然的，可見性可見，這就是爲什麼，因爲沒有進一步的分配，那麼它保持不變。那麼對行爲的解釋可能必須是在函數之前聲明的X值= 0不是全局的。 – Alvaro 2010-10-19 10:27:19

什麼工作：
你有兩個按鈕，在開始的時候都可見。點擊一個按鈕後，你隱藏了一個div，並且再次可見。

現在你需要一個情況，當div應該隱藏在開頭，然後顯示你點擊一個按鈕。

默認情況下，對於未給出顯式visibility屬性的所有元素，visibility被認爲是visible。

要使按鈕不可見，您需要將visibility:hidden添加到按鈕。

你可以做到這一點有兩種方式：

在爲div是代碼，加入 style='visibility:hidden'使然後「在默認情況下不可見」。

添加另一個javascript函數被調用頁面的加載，使雙方的div無形：

function hideBoth() 
{ 
    document.getElementById("cont1").style.visibility="hidden"; 
    document.getElementById("cont2").style.visibility="hidden" ; 
}

調用它在你的頁面的加載：<body onload='hideBoth()'>

來源

2010-10-18 17:26:13 Nivas

感謝你們兩位評論者：我的結論與你們的提案合作之後是：1）我認爲問題的原因是x = 0的分配將不起作用，儘管明顯存在這樣的呼叫是X被放置在外面在函數的開始之前。 2）如果我內嵌隱藏在html標籤中的可見性，儘管它隱藏了它，但它不會在點擊按鈕時顯示。 3）最後，從主體的onload調用函數和hideboth函數的添加取得了訣竅。非常感謝你。阿爾瓦羅 – Alvaro 2010-10-19 10:37:41

的一些標記該行：

document.getElementById("cont1").style.visibility="hidden";

添加此：

style="visibility: hidden;"

這樣：

<div id="cont1">

，使它看起來像這樣：

<div id="cont1" style="visibility: hidden;">

你可以自己做，只是通過添加屬性到您的HTML標籤。

哦，是的，這一點：

<div id="cont1">

是一樣的：

<div id="cont1" style="visibility: visible;">

來源

2010-10-18 17:08:29

html元素表單的條件顯示

回答

相關問題