Forms 无线电基金会 我对Zurb基金会有个问题。事实上,表格显示正确,但我无法选择

Forms 无线电基金会 我对Zurb基金会有个问题。事实上,表格显示正确,但我无法选择,forms,button,radio-button,zurb-foundation,Forms,Button,Radio Button,Zurb Foundation,这是我的密码: 你可以看到,在第一种形式中,收音机工作,但第二种不工作 我尝试了很多方法来解决这个问题,但我不知道问题出在哪里 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link rel="stylesheet" href="../css/foundation.css"/> <link rel="stylesheet" hr

这是我的密码: 你可以看到,在第一种形式中,收音机工作,但第二种不工作

我尝试了很多方法来解决这个问题,但我不知道问题出在哪里

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="../css/foundation.css"/>
        <link rel="stylesheet" href="../css/normalize.css"/>
        <script src="../js/vendor/custom.modernizr.js"></script>
        <title></title>
    </head>
    <body>
        <div class="row">  
            <form class="custom">
                <div class="row">
                    <div class="large-4 columns">
                        <label for="radio1"><input name="radio1" type="radio" id="radio1" style="display:none;" CHECKED><span class="custom radio checked"></span> Radio Button 1</label>
                        <label for="radio1"><input name="radio1" type="radio" id="radio1" style="display:none;"><span class="custom radio"></span> Radio Button 2</label>
                    </div>
                </div>
            </form>
            <div class="section-container auto" data-section>
                <section>
                    <p class="title" data-section-title><a href="#panel1">Section 1</a></p>
                    <div class="content" data-section-content>
                        <form class="custom">
                            <div class="row">
                                <div class="large-4 columns">
                                    <label for="radio2"><input name="radio2" type="radio" id="radio2" style="display:none;" CHECKED><span class="custom radio checked"></span> Radio Button 1</label>
                                    <label for="radio2"><input name="radio2" type="radio" id="radio2" style="display:none;"><span class="custom radio"></span> Radio Button 2</label>
                                </div>
                            </div>
                        </form>
                    </div>
                </section>
                <section>
                    <p class="title" data-section-title><a href="#panel2">Section 2</a></p>
                    <div class="content" data-section-content>
                       <p>section2</p>
                    </div>
                </section>
            </div>
        </div>

        <script src="../js/vendor/jquery.js"></script>
        <script src="../js/foundation/foundation.js"></script>
        <script src="../js/foundation/foundation.forms.js"></script>
        <script src="../js/foundation/foundation.section.js"></script>
        <script src="../js/vendor/zepto.js"></script>

        <script>
            $(document).foundation();

        </script>
   <body>

单选按钮1
单选按钮2

单选按钮1 单选按钮2

第2节

$(document.foundation();
一个id不能多次使用。可能是这样。

尝试将
id
仅设置为要选择的按钮,或对每个选项使用不同的id:

比如:

<form class="custom">
                <div class="row">
                    <div class="large-4 columns">
                        <label for="radio1"><input name="radio1" type="radio" id="CustomFormRadio1" style="display:none;" CHECKED><span class="custom radio checked"></span> Radio Button 1</label>
                        <label for="radio1"><input name="radio1" type="radio" id="CustomFormRadio2" style="display:none;"><span class="custom radio"></span> Radio Button 2</label>
                    </div>
                </div>
            </form>
<form class="custom">
                <div class="row">
                    <div class="large-4 columns">
                        <label for="radio1"><input name="radio1" type="radio" id="radio1" style="display:none;" CHECKED><span class="custom radio checked"></span> Radio Button 1</label>
                        <label for="radio1"><input name="radio1" type="radio" style="display:none;"><span class="custom radio"></span> Radio Button 2</label>
                    </div>
                </div>
            </form>
if($('#CustomFormRadio1').is(':checked')){ 
      //whatever you want here
}