0 
    <body>
    <input type="textbox" id="fname"></input>
    <button type="button" onclick="javascript:show('select'); return false;">Click</button></br>
    <input type="radio" id="select" style="display:none;"></input>
</body>

我编写的代码似乎是合乎逻辑的，但是在这种情况下，当我单击按钮时，它似乎不起作用..任何人都告诉我我哪里出错了

提前致谢。

    <head>
    <title>show and hide javascript</title>
    <script type="text/javascript">
        function show(id) {
            //alert("Its working");
            var myId = document.getElementById.id;
            if (myId.style.display = 'none') {
                myId.style.display = 'block';
            } else {
                myId.style.display = 'none';
            }

        }
    </script>
</head>
4

4 回答 4

1

我发现您的功能存在三个问题：

1）更正此行=中的 a ==：

if (myId.style.display == 'none') {

2）改变这个：

document.getElementById.id;

为此使其成为实际的函数调用：

document.getElementById(id);

3)使用跨浏览器getStyle()功能，这样您的样式值将包括 CSS 设置，而不仅仅是直接在对象上设置的内容。直接从对象中读取样式属性，只获取对象上直接设置的样式值，不获取默认值。它也不会反映通过 CSS 设置的内容。您可以实现一个跨浏览器功能来获取样式属性，包括通过 CSS 设置的内容，如下文所示：

function getStyle(el, cssprop){
    if (el.currentStyle) //IE
        return el.currentStyle[cssprop]
    else if (document.defaultView && document.defaultView.getComputedStyle) //Firefox
        return document.defaultView.getComputedStyle(el, "")[cssprop]
    else //try and get inline style
        return el.style[cssprop]
}

然后，您可以像这样实现您的功能：

    function show(id) {
        //alert("Its working");
        var myId = document.getElementById(id)
        if (getStyle(myId, "display") === "none") {
            myId.style.display = 'block';
        } else {
            myId.style.display = 'none';
        }
    }

另外，由于您的功能实际上是一个切换，而不仅仅是一个节目，我建议将其重命名为toggle(). 您可能还想知道，这只适用于块元素。如果你在一个内联元素上尝试它，它会隐藏它，但是当它显示它时，它会将内联元素变成一个块元素。

于 2012-07-16T19:28:50.270 回答
0 
document.getElementById(id)  // without the dot before parens

在没有建议的双 == 的情况下，此代码似乎可以正常工作。在更改 (id) 并删除点之前，它不会起作用。

<html><head><title>test</title></head>
<body>

<script type="text/javascript">
        function show(id){
            //alert("Its working");
            var myId=document.getElementById(id);
            if(myId.style.display=='none'){
                myId.style.display='block';
            }
            else{
                myId.style.display='none';
            }

        }
    </script>

<h1>Test</h1>

<input type="textbox" id="fname"></input>
    <button type="button" onclick="javascript:show('select'); return false;">Click</button></br>
    <input type="radio" id="select" style="display:none;" />

</body>
</html>
于 2012-07-16T19:30:05.437 回答
0 
   function show(id) {
        //alert("Its working");
        var myId = document.getElementById(id);
        if (myId.style.display == 'none') {
            myId.style.display = 'block';
        } else {
            myId.style.display = 'none';
        }

    }

FTFY

于 2012-07-16T19:31:11.563 回答
-1

更改此行： if(myId.style.display='none'){

至：

if(myId.style.display==='none'){
于 2012-07-16T19:26:39.667 回答