Question

我正在为我的实习创建一个网页，当我选中名为“example”的复选框时，我想添加一个div“example”。我想在未经检查的情况下删除此div 我真的不知道如何开始，怎么做。

编辑：好的，我明白了。
我有几个复选框，有没有办法为每个人做这个？

在这里，我创建了我的复选框：

my %labels = (
        'rdc7' => 'switch-rdc-7',
        'rdc8' => 'switch-rdc-8',
        'rdc4' => 'switch-rdc-4',
        '3750' => 'switch-3750' 
      );

    print $cgi->checkbox_group(
        -name => 'switch_choices',
        -values => ['rdc4', 'rdc7', 'rdc8', '3750'],
        -default => ['rdc7', 'rdc8'],
        -labels => \%labels
    );

当它被检查时，我想通过以下方式添加div：
my $switch1 = SwitchGUI->new("switch-rdc-7", 24, 2);
（它产生一个id =“switch-rdc-7”的div。）

Answer 1

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" />
<script>
    $('input:checkbox').change(function(){
        if( $(this).is(':checked') ){
            $(this).after( $('<div class="example_text">Example</div>') );
        }else{
            $(this).next('.example_text').remove();
        }
    });
</script>

Answer 2

您应该为Checkbox添加onClick（）事件，然后确定是否选中了Checkbox。根据设置，您可以显示/隐藏该div的内容。

如果要从服务器上获取它，则需要使用AJAX。

Ajax：使用复选框添加/删除div

2 个答案: