html可見性風格不起作用

我有一個奇怪的問題。我有按鈕，「NextButton」，我想先隱藏，但然後當一個複選框被點擊時，它應該出現。下面的代碼不起作用，它不會給出任何錯誤。我已經測試了IE9和Firefox 13 我搜索其他的問題，但找不到，我有問題...html可見性風格不起作用

<html> 
<head> 
<script language="javascript"> 
     function enableNext() { 
      alert("clicked"); 

      var s1 = document.getElementsByName("NextButton"); 
      s1.style.visibility = "visible"; 
     } 
    </script> 
</head> 

<body> 
<input type="submit" name="NextButton" value="Next" style="visibility:hidden;"/> 
<input type="checkbox" onClick="enableNext()" /> 
</body> 

</html>

來源

2012-07-12 user156144

你確定它不會給任何錯誤？ – BoltClock 2012-07-12 07:04:58

謝謝大家。 – user156144 2012-07-12 07:18:20

在代碼中返回一個數組，並將樣式應用於數組。將其更改爲下面的代碼。

function enableNext() { 
      alert("clicked"); 

      var s1 = document.getElementsByName("NextButton")[0];//Get the first and only button in your case 
      s1.style.visibility = "visible"; 
     }

來源

2012-07-12 07:05:34

document.getElementsByName返回匹配元素的數組，你必須循環在其上並更改數組中單個項目的樣式。您可以使用jQuery輕鬆地處理它$("[name='NextButton']").css("visibility", "visible")或者如果您想使用css display屬性，您可以使用$("[name='NextButton']").show()或.hide()。另外，如果你不想使用jQuery，你可以使用一個id，而不是使用getElementsByName使用getElementById，它會返回你需要的單個元素。

來源

2012-07-12 07:05:23 haynar

我想你應該嘗試使用CSS而不是JavaScript。

嘗試使用

document.getElementsByName("NextButton")[0];

來源

2012-07-12 07:05:55

你應該使用HTML元素id然後document.getElementById()。這將提供完全匹配的元素。

<script language="javascript"> 
     function enableNext() { 
      alert("clicked"); 

      var s1 = document.getElementById("NextButton"); 
      s1.style.visibility = "visible"; 
     } 
</script>

<input type="submit" id="NextButton" name="NextButton" value="Next" style="visibility:hidden;"/>

來源

2012-07-12 07:11:01

嘗試過，但沒有奏效。無論如何，謝謝 – user156144 2012-07-12 07:18:01

@ user156144：你是否添加了'id'按鈕？ – 2012-07-12 07:27:45

html可見性風格不起作用

回答

相關問題