Question

我有一个奇怪的问题。我有按钮，“NextButton”，我想先隐藏，但是当点击一个复选框时，它应该出现。下面的代码不起作用，它不会给出任何错误。我在IE9和FireFox 13上测试过它我搜索了其他问题，但找不到我遇到的问题......

<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>

Answer 1

在代码中返回一个数组，并将样式应用于数组。将其更改为以下代码。

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

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

Answer 2

document.getElementsByName返回匹配元素的数组，您必须循环它并更改数组中各个项的样式。您可以使用jQuery轻松处理$("[name='NextButton']").css("visibility", "visible")，或者如果您想使用css display属性，则可以使用$("[name='NextButton']").show()或.hide()。此外，如果您不想使用jQuery，您只需使用id，而不是使用getElementsByName使用getElementById，它将返回您需要的单个元素。

Answer 3

您应该在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;"/＆GT;

Answer 4

我猜你应该尝试使用css而不是单独使用javascript。

尝试使用

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

HTML可见性样式不起作用

4 个答案: