隐藏/显示多个Div [英] Hide / Show Multiple Divs

问题描述

我试图创建一个表单，其中有各种隐藏/显示，其中最后一个部分，我需要做的这种形式是SHOW的付款信息字段时，只选择信用卡。

我在此处设置了测试页： http://www.faa.net.au/test/femmes-member-form.html

目前处理为：

1. 输入您的详细信息


2. 选择活动日期


3. 更多客人要求付款详情


4. 目前，我已经显示了3个DIV，根据所选的收音机选项，我想显示，但当我隐藏这些，我已经到位的代码




任何人都可以在这里帮助我吗？





如果你需要代码，请让我知道，有一些不同的元素涉及我不想粘贴整个事情在这里，希望你可以看到源代码？





这里是我目前的Javascript，但不知道这是错误的，还是它与其他的东西冲突？

 code>< script type =text / javascript> 
 $（function（）{
 $（'。cat_dropdown'）。change（function（）{
 $（'＃payMethod'）。 > = 2）; 
}）; 
}）; 
< / script> 
< script type =text / javascript> 
 $（document）.ready（function（）{
 $（payOptions）。click（function（）{
 $（。paymentinfo）。hide b $ b switch（$（this）.val（））{
 caseCredit card Authorization：
 $（＃pay0）。show（slow）; 
 break ; 
 case直接存款：
 $（＃pay1）。show（slow）; 
 break; 
 case现金付款
 $（＃pay2）。show（slow）; 
 break; 
} 
}）; 
} 
< / script> 
  




解决方案

根据View Souce查看代码并猜测没有在事件处理程序中添加正确的类。





更改

  $（。payOptions）。click（function（）{
  

到

  $（。paymentmethod）click（function（）{
  
I am trying to create a form that has various hide/reveals in it and one of the last parts I need to do to this form is SHOW the payment information fields when only Credit Card is selected.

I have a test page setup here: http://www.faa.net.au/test/femmes-member-form.html

Process so far is:

Enter your details
Select Event Date
Selecting Member + 1 or more Guests ask for payment details
At the moment, I have displayed the 3 DIVs that I want to appear depending on the radio selection made but when I hide these, the code I have in place at present doesn't work.
Can anyone help me here at all please?

If you need the code, please let me know, with a number of different elements involved I didnt want to paste the whole thing on here, hopefully you can see the Source Code?

Here is the Javascript I have at present but not sure if its this that is wrong or if its clashing with something else?
        <script type="text/javascript">
        $(function() {
            $('.cat_dropdown').change(function() {
                $('#payMethod').toggle($(this).val() >= 2);
            });
        });     
    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $(".payOptions").click(function () {
                $(".paymentinfo").hide();
                switch ($(this).val()) {
                    case "Credit Card Authorisation":
                        $("#pay0").show("slow");
                        break;
                    case "Direct Deposit":
                        $("#pay1").show("slow");
                        break;
                    case "Cash Payment (FAA Office)":
                        $("#pay2").show("slow");
                        break;
                }
            });
        });
    </script>

解决方案
As per viewing code from View Souce and guessing that you have not added correct class  in event handler. thus click event for radio is not getting invoked.

Change
$(".payOptions").click(function () {
to
$(".paymentmethod").click(function () {


                        
这篇关于隐藏/显示多个Div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！