Question

我想使用无线电输入在选择div时使div可见。这是我所得到的，但它不起作用。

HTML：

<input type="radio" name="menu" id="btn_commandprompt" value="1"></input>
                <label for="btn_commandprompt"">
                    <div id="btn_commandprompt_design"></div>
                </label>

<div id="commandprompt"></div>

CSS：

    #commandprompt{
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
}


#btn_commandprompt:checked ~ #commandprompt{
    display: block;
}

由于

Answer 1

this should work


<body>
<input type="radio" name="menu" id="btn_commandprompt" value="1" onclick="show()"> Click Me</input>
<div id="btn_commandprompt_design"></div>

<div id="commandprompt" style="display:none">Show Me</div>
</body>


<script>


function show(){
  document.getElementById("commandprompt").style.display = 'block';
}


</script>

Answer 2

如果你把东西放在Div里面，它会起作用。您的代码是正确的，只需在Div中添加一个段落，然后重新尝试。

Answer 3

I have modify your code. its now working...


  <style>
   #commandprompt{
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
}


#btn_commandprompt:checked ~ #commandprompt{
    display: block;
}
  </style>

<body>
<input type="radio" name="menu" id="btn_commandprompt" value="1"> Show Me</input>
<input type="radio" name="menu" id="btn_acceuil" value="1"> Hide Me</input>

<div id="btn_commandprompt_design"></div>

<div id="commandprompt">ooh!!</div>
</body>

使用无线电输入使用CSS可以看到div

3 个答案: