Ajax：使用chekboxes添加/刪除div

我正在爲我的實習創建一個網頁，我想在選中名爲「example」的複選框時添加div「示例」。我想在未選中時刪除此div。
我真的不知道該怎麼開始，該怎麼做。Ajax：使用chekboxes添加/刪除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的一個div = 「切換-RDC-7」）。

來源

2011-04-27 eouti

<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>

來源

2011-04-27 08:06:43 Homer6

沒有必要爲了顯示/隱藏div而引入對JQuery的依賴。 – 2011-04-27 08:11:36

jQuery是一個非常常見的包。而且他沒有說沒有行業標準的JavaScript庫就需要完成它。人們編寫圖書館是有原因的。 – Homer6 2011-04-27 08:13:07

也許不是，但有可能不會是頁面上唯一的javascript，再加上Google CDN的服務意味着腳本可能已經被潛在用戶緩存 – Alex 2011-04-27 08:15:46

您應該爲複選框添加onClick（）事件，然後確定是否選中複選框。根據設置，您可以顯示/隱藏該div的內容。

如果您要從服務器獲取它，您需要使用AJAX。

來源

2011-04-27 08:03:58

Ajax：使用chekboxes添加/刪除div

回答

相關問題