智能嚮導有兩個步驟沒有正確呈現

Question

對於表單，我正在使用智能嚮導實例：https://github.com/mstratman/jQuery-Smart-Wizard。

我現在只有兩個步驟，它呈現不正確。該行比第二個泡泡長。我怎樣才能解決這個問題？

<form id="reportForm" method="post"> 
    <div id="reportWizard" class="form_wizard wizard_horizontal"> 
     <ul class="wizard_steps"> 
     <li> 
      <a href="#step-1"> 
      <span class="step_no">1</span> 
      <span class="step_descr"> 
      Schritt 1<br/> 
      <small>Spielinformationen angeben</small> 
      </span> 
      </a> 
     </li> 
     <li> 
      <a href="#step-2"> 
      <span class="step_no">2</span> 
      <span class="step_descr"> 
      Schritt 2<br/> 
      <small>Bewertung abgeben</small> 
      </span> 
      </a> 
     </li> 
     </ul> 
     <div id="step-1"> 
     <div class="form-horizontal form-label-left">         
     </div> 
     </div> 
     <div id="step-2"> 
     <div class="form-horizontal form-label-left"> 
     </div> 
     </div> 
    </div> 
</form> 

<script> 
$(document).ready(function() { 
    $('#reportWizard').smartWizard({ 
     // Properties 
     labelNext: 'Weiter', // label for Next button 
     labelPrevious: 'Zurück', // label for Previous button 
     labelFinish: 'Bericht anlegen', // label for Finish button 
     onFinish: function() { 
      document.getElementById("reportForm").submit(); 
     } // triggers when Finish button is clicked 
    }); 
    $('.buttonNext').addClass('btn btn-success'); 
    $('.buttonPrevious').addClass('btn btn-primary'); 
    $('.buttonFinish').addClass('btn btn-default'); 
}); 
</script> 

Answer 1

只是檢查你的代碼

並試用了此

<form id="reportForm" method="post"> 
          <div id="reportWizard" class="form_wizard wizard_horizontal"> 
           <ul class="wizard_steps"> 
            <li> 
             <a href="#step-1"> 
              <span class="step_no">1</span> 
              <span class="step_descr"> 
               Schritt 1<br /> 
               <small> angeben</small> 
              </span> 
             </a> 
            </li> 
            <li> 
             <a href="#step-2"> 
              <span class="step_no">2</span> 
              <span class="step_descr"> 
               Schritt 2<br /> 
               <small> abgeben</small> 
              </span> 
             </a> 
            </li> 
           </ul> 
           <div id="step-1"> 
            <div class="form-horizontal form-label-left"> 
            </div> 
           </div> 
           <div id="step-2"> 
            <div class="form-horizontal form-label-left"> 
            </div> 
           </div> 
          </div> 
         </form> 

並檢查長說明詞不被智能嚮導支持。因爲如果你刪除了「Bewertung」和「Spielinformationen」，它就起作用了。