这有什么不对?复选框不起作用

时间:2013-03-08 00:29:12

标签: javascript forms checkbox hidden

我正在尝试隐藏/显示段落的复选框,但出于某种原因,当我点击复选框时,段落不会出现,这里是JavaScript代码:

function showPara()
{
    document.getElementById("first").style.visibility=(document.formex.firstpara.checked) ? "block" : "hidden";
    document.getElementById("second").style.visibility=(document.formex.secondpara.checked) ? "block" : "hidden";
    document.getElementById("third").style.visibility=(document.formex.thirdpara.checked) ? "block" : "hidden";
    return true:
}

以下是HTML代码:

<p id="first">This is a paragraph</p>
<p id="second">This is a paragraph</p>
<p id="third">This is a paragraph</p>

<form name="formex">
    <input type="checkbox" name="firstpara" onClick="showPara();"/>First Paragraph<br />
    <input type="checkbox" name="secondpara" onClick="showPara();"/>Second Paragraph<br />
    <input type="checkbox" name="thirdpara" onClick="showPara();"/>Third Paragrpah<br />
</form>

2 个答案:

答案 0 :(得分:5)

没有visibility: block,因此hidden未被更改。使用visibility: visible。您在函数中也有语法错误(return true;return true:)。

http://jsfiddle.net/frKXN/1/

答案 1 :(得分:2)

visibility CSS属性可以有两个值:hiddenvisible

您将其设置为block,但这不起作用。您可能会将其与display属性混淆,后者可以设置为blocknone以及其他一些值。

相关问题