复选框在提交后消失

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。是最好的解决方案，但它工作正常。