使用单选按钮显示/隐藏 div 的多种重力形式验证
Posted
技术标签:
【中文标题】使用单选按钮显示/隐藏 div 的多种重力形式验证【英文标题】:multiple gravity forms validation with show/hide div using radio button 【发布时间】:2012-08-31 17:05:39 【问题描述】:我在同一页面上使用 2 个重力形式时遇到问题。首先,每个表单都在一个隐藏的“div”中,用户必须从 3 个显示/隐藏另一个表单的单选按钮中进行选择。这部分有效,然而如果验证失败,页面刷新并且表单被隐藏。用户必须重新单击同一个收音机才能查看验证失败的原因。我还设置了重力形式以使用 ajax 模式,但这并不能解决问题。
这就是我的 javascript 的样子:
<script type="text/javascript">
jQuery(document).ready(function()
jQuery(".cdiv").hide();
jQuery("input[name=contact_type]").change(function()
var _div_id = jQuery(this).val();
jQuery(".cdiv").hide('slow');
jQuery("#"+_div_id).show('slow');
);
);
</script>
html 看起来像这样(我删除了表单以保持 html 简短)
<input type="radio" name="contact_type" value="c1" /> Careers <br />
<input type="radio" name="contact_type" value="c2" /> Partner with us <br />
<input type="radio" name="contact_type" value="c3" /> Media Inquiries <br />
<div class="cdiv" id="c1">
[career info here]
</div>
<div class="cdiv" id="c2">
form 1 loads here
</div>
<div class="cdiv" id="c3">
form 2 loads here
</div>
非常感谢您的帮助和建议。谢谢!
【问题讨论】:
【参考方案1】:网页是无状态的 - 当他们加载(或重新加载)时,他们不知道他们之前的状态是什么。
恢复状态由您决定,因此您必须在某处记录此状态。这通常存储在 URL 哈希或 cookie 中。
这应该如何与 URL 哈希一起工作(您需要编写代码来执行此操作):
当用户单击其中一个单选按钮时,您将 document.location.hash
设置为已知值,例如“b1”。
然后,当页面重新加载时,您查看document.location.hash
的当前值(使用 JS),如果该值为“b1”,则您知道用户按下了单选按钮 #1。然后您的脚本会显示相应的面板。
【讨论】:
以上是关于使用单选按钮显示/隐藏 div 的多种重力形式验证的主要内容,如果未能解决你的问题,请参考以下文章