Question

我在使用JavaScript代码时遇到了一些问题，因为如果此人选中了复选框，我会显示一个新的div，但是如果选中了另一个复选框，则div应该会消失，但确实如此，这里是我的代码：

<script type="text/javascript">
    var checkDisplay = function(check, form) { //check ID, form ID
        form = document.getElementById(form), check = document.getElementById(check);
        check.onclick = function(){
            form.style.display = (this.checked) ? "block" : "none";
            form.reset();
        };
        check.onclick();
    };
</script>

这是HTML块：

<div id="Opciones">
        <p style="display: inline-block;">Efectivo</p>&nbsp;&nbsp;<input type="checkbox" value="1" id="efe" name="check"/>
        <p style="display: inline-block;">Deposito</p>&nbsp;&nbsp;<input type="checkbox" value="2" id="depo" name="check"/>
    </div>

    <div id="deposi">
        <div class="row">
             <input type="checkbox"/>
        </div>
    </div>
<script type="text/javascript">
    checkDisplay("depo", "deposi");
</script>

只有其中一个checboxes应该被标记，如果被检查depo复选框打开一个新的div与一个新的输入和另一件事，但如果一个cheked efe chechbox之前出现的div应该消失，简而言之，如果一个复选框应该出现在一个表格中，但如果在另一个表格中，则应该消失。

当显示div时问题变为，如果我选择另一个复选框，表单不会消失

请...我需要有关此代码的帮助...如果您有其他代码非常棒！

Answer 1

解决方案是创建一个和一个并在javascript中相关联以显示值何时相同并隐藏它何时更改

><select name="status" id="status">
>    <option value="">pick one...</option>
>    <option value="show">show</option>
>    <option value="hide">hide</option>
></select>
><div name="razordiv" id="razordiv">Hi!</div>
><script>$(document).ready(function() {
>        $("#razondiv").hide();
>        $("#status").change(function() {
>           if ($("#status").val() == 'show') {
>               $("#razondiv").show();
>           }
>           else {
>               $("#razondiv").hide();
>           }
>        });
>     });
></script>

数组复选框显示一个新的div

1 个答案: