Основание радио

У меня возникла проблема с формой основания ZURB. Действительно, форма отображается правильно, но я не могу выбрать.Основание радио

Это мой код: Вы можете видеть, что в первом виде радио работает, но второе не работает.

Я пробую много вещей, чтобы решить эту проблему, но я не понимаю, где проблема.

 <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>

источник

2013-06-10 Nivek

Вы не можете использовать один идентификатор несколько раз. Вероятно, это так.

источник

2013-08-09 13:29:02

Попробуйте установить id только кнопки вы хотите выбрать или использовать diffeent идентификаторы для каждого варианта:

Нравится:

<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>

И тогда вы можете делать все, что вы хотите с ним, используя javaScript с jQuery, например:

if($('#CustomFormRadio1').is(':checked')){ 
     //whatever you want here 
}

источник

2014-03-29 22:36:22 jPratas

Основание радио

ответ

Смежные вопросы