Question

我有以下Javascript功能：

<script>
    $(document).ready(function() {
        $('input[name=\"html5Alert\"]').on('change', function() {
          $('.html5Alert-fields').toggle(+this.value === 1 && this.checked);
        }).change();
    }
</script>

它根据单选按钮显示或隐藏DIV。 “ON”显示DIV，“OFF”显示DIV。当我切换单选按钮时，脚本可以正常工作。它根据选择的单选按钮显示或隐藏DIV。

我还可以根据数据库中的值设置单选按钮的值。

但是，它不能正常工作。

Javascript需要在页面加载时检测单选按钮的值，并根据这些值显示/隐藏DIV。目前它的工作原理是手动更改单选按钮，但它在页面加载时没有显示正确的状态。

如何在页面加载后运行上面的代码？

Answer 1

关闭document.ready功能。

<script>
$(document).ready(function() {
    $('input[name=\"html5Alert\"]').on('change', function() {
      $('.html5Alert-fields').toggle(+this.value === 1 && this.checked);
    }).change();
});
</script>

Answer 2

您还需要在onchange事件之外运行我们的切换

＆＃xA;

Answer 3

我最终选择了另一种方法，这种方法运行正常。

<script>
$(document).ready(function() {
    if ($('#html5Alert1').is(':checked')) {
        $('.html5Alert-fields').show();
    } else {
        $('.html5Alert-fields').hide();
    }

    $('input[name=\"html5Alert\"]').on('change', function() {
        if ($('#html5Alert1').is(':checked')) {
            $('.html5Alert-fields').show();
        } else {
            $('.html5Alert-fields').hide();
        }
    });
});
</script>

在页面加载时无法使函数正常工作

3 个答案: