Question

我想仅在选中某个复选框时显示表单字段文本框，并在未检查时隐藏它。当我选中该框时，我已经获得了使其隐藏的代码，但是在加载页面时会显示文本框，直到我选中该框，这与我想要完成的内容相反。我对javascript非常新鲜，所以我确信这是非常基础的。谢谢你的帮助。

HTML：

<input type="checkbox" onclick="ShowCCFields(this.value);" name="CAT_Custom_510969" id="CAT_Custom_510969_7" value="Other..." />
Other...

<div class="item" id="other">
    <label for="CAT_Custom_510972">Other:</label><br />
    <textarea onkeydown="if(this.value.length&gt;=4000)this.value=this.value.substring(0,3999);" class="cat_listbox" rows="4" cols="10" id="CAT_Custom_510972" name="CAT_Custom_510972"></textarea>
</div>

的javascript：

// Hide or show textarea if the other checkbox field is checked
        var voucher = document.getElementById("CAT_Custom_510969_7");
        function ShowCCFields(val) {                            
            if (!document.getElementById('other'))
                return;         
            if (val == voucher.checked)
                document.getElementById('other').style.display = 'inline';              
            else
                document.getElementById('other').style.display = 'none';
        }

Answer 1

在HTML中将样式设置为none，就像在javascript中一样：

<div class="item" id="other" style="display:none;">

Answer 2

为什么不将显示设置为无开头？您可以在CSS中执行此操作或只将其添加到

<div class="item" id="other" style="display: none;">

Answer 3

在要隐藏的控件中将“显示”设置为“无”：

<div class="item" id="other" style="display: none;">

在你的js功能：

document.getElementById('other').style.display = 'inline';

用javascript隐藏/显示div

3 个答案: