複選框在提交後消失

Question

我試圖在點擊提交按鈕後顯示我的選中框。但我的jQuery腳本將隱藏檢查的div。

即使在提交表單後，我想顯示檢查的div。

這是我的HTML：

<form action="" method="POST"> 
<br /> 
<div id="myDiv"> 
<input class="check_app" type="checkbox" /> 
<input class="check_app2" type="checkbox" /> 
<input class="check_app3" type="checkbox" /> 
</div> 
<div class="hide">blabla</div> 

<div class="hide2"> 
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas faucibus mollis interdum. Maecenas faucibus mollis interdum. Donec sed odio dui. Vestibulum id ligula porta felis euismod semper. 
</div> 
<br /> 
<button id="submitbutton" type="submit" name="action" value="submit">Send in Request</button> 
</form> 

我的Jquery

$('.check_app').change(function() { 
if ($(this).attr("checked")) { 

    $('.hide').fadeIn(); 
    return; 
} 
$('.hide').fadeOut(); 
}); 

$('.check_app2').change(function() { 
if ($(this).attr("checked")) { 

    $('.hide2').fadeIn(); 
    return; 
} 
$('.hide2').fadeOut(); 
}); 

CSS下面

.hide, .hide2 { 
    display: none; 
} 

您可以查看這裏的代碼： http://jsfiddle.net/SolidSmash/7W8Up/

任何幫助都會很棒！

對不起，如果我的問題不清楚。不過，我會盡量解釋它在下面詳細：

1.我有我的表單中的情侶複選框
2.這些複選框觸發一個div（如類=「隱藏」），顯示（通常這些div隱藏）
3.當選中複選框並單擊提交按鈕時，顯示的div將消失（淡出）。

我想在提交後保留div，如果它是由複選框觸發的。

Answer 1

難道你的意思是：

如果用戶檢查一個或多個複選框，然後點擊提交，並返回到頁面，服務器端處理後，要選擇那些相同的複選框，並各自DIV正在顯示？

如果是這樣，一對夫婦方法可以採取：

1 - 確定被檢查，服務器端的複選框，當窗體/頁發佈到服務器，而且不適用.hide ，.hide2等類別到其各自的DIV - 基於選中的複選框 - 在返回的路上。

2 - 在返回時注入一點內聯JavaScript，這會觸發檢查過的複選框的點擊。讓我們假設複選框class =「check_app2」在提交被點擊之前被選中。然後，服務器端，確定被檢查其中的複選框（在這種情況下，一個帶有class =「check_app2」）注入像一些腳本：

$(".check_app2").trigger("click"); 

原因＃2是這樣，你會得到的DIV褪色一旦頁面被加載。不要設置複選框服務器端的選中狀態。

我也會改變你的更改處理程序是更通用和可重用的，你重複自己。

一些額外的代碼供您參考。我並不是說這是理想的代碼，只是適合你的工作。不幸的是，我沒有使用過PHP，所以無法提供任何代碼在這方面工作。

HTML

<input data-div-class="hide" class="check_app" type="checkbox" /> 
<input data-div-class="hide2" class="check_app2" type="checkbox" /> 
<input class="check_app3" type="checkbox" /> 

jQuery的

function Checkbox_OnChange() { 
    var divClass = $(this).data("div-class"); 
    $("div."+divClass).fadeToggle(); 
} 
$("input[type=checkbox]").on("click", Checkbox_OnChange); 
$(".check_app2").trigger("click"); 

鑑於上述工作在這裏：http://jsfiddle.net/emgee/pYH8S/

:)

Answer 2

我的形式是工作:)

如何？
1.I使用下面的代碼通過emgee清理我以前的js腳本（舊是雖然工作正常，但頗重使用）：

<script type="text/javascript"> 

function Checkbox_OnChange() { 
var divClass = $(this).data("div-class"); 
$("div."+divClass).fadeToggle(); 
} 
$("input[type=checkbox]").on("click", Checkbox_OnChange); 

</script> 

2.Added下面的代碼（用PHP）在被觸發的div上生成一個內聯的CSS。

<?php if ((isset($services)) && (in_array("My Service", $services))) { echo 'style="display:block"'; } ?> 

的PHP生成風格=「顯示：塊;如果該複選框被表單處理後設置在我的情況

所以：

<div class="hide2" <?php if ((isset($services)) && (in_array("My Service", $services))) { echo 'style="display:block"'; } ?>> 
    Praesent commodo cursus magna, vel scelerisque nisl consectetur et. 
    Maecenas sed diam eget risus varius blandit sit amet non magna. 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
    Maecenas faucibus mollis interdum. Maecenas faucibus mollis interdum. 
</div> 

這ISN。是最好的解決方案，但它工作正常。