jquery - 为什么选中取消选中不显示/隐藏内容？

Question

http://gomoxy.com/una/edmontonautoloans/credit-application.php

我的jQuery代码：

$("#callback_toggle").is(':checked')){
    $("#txthiden").hide();
    }else{
   $("#txthiden").show();
}

当我选中复选框时，我想隐藏txthidendiv 中的内容。反之亦然。默认状态是未选中。并且txthidendiv 中的内容正在显示。为什么我的代码不起作用。谢谢你。

Answer 1

工作演示 http://jsfiddle.net/ACnn4/1/

代码

$("#callback_toggle").on('change', function() {
    if ($(this).is(':checked')) {
        $("#txthiden").hide();
    } else {
        $("#txthiden").show();
    }
});

Answer 2

改变：

$("#callback_toggle").is(':checked')){

到：

if ($("#callback_toggle").is(':checked')) {

Answer 3

[在此处对拼写错误和基于表格的布局进行强制性咆哮<div>]

您需要为此使用事件处理程序。您的代码试图在 DOMready 中进行切换，而不是在复选框被切换时进行切换。

$('#callback_toggle').change(function() {
    if ($(this).is(":checked")) {
        ("#txthiden").hide();
    } else {
        ("#txthiden").show();
    }
});

Answer 4

你可以试试这个应该可以的。

这可能是最简单的一个。看演示

$("#callback_toggle").click(function() {
        $("#txthiden").toggle();
});​

这个也可以

$("#callback_toggle").click(function() {
    if ($(this).is(':checked')) {
        $("#txthiden").hide();
    } else {
        $("#txthiden").show();
    }
});​