Jquery Smart Wizard зависает - PullRequest
Новая
       17

Jquery Smart Wizard зависает

1 голос
/ 23 марта 2012

Я использую IE 8 и jquery smart wizard версии 3.2.0.Я заметил, что когда смарт-мастер заключен в дополнительный тег <div> (с целью отображения мастера во всплывающем окне диалога jquery), мастер не будет продвигать шаги, если для события onLeaveStep указана функция.

А теперь код:

JavaScript, настраивающий мастера: 

$('#wizard').smartWizard({ transitionEffect: 'slideleft', onLeaveStep: leaveAStepCallback, onFinish: onFinishCallback});

Простые функции, связанные с событиями для мастера: 

  // wizard functions
function leaveAStepCallback(obj) {
    // Get current step
    var step_num = obj.attr('rel'); // get the current step number
}
function onFinishCallback() {
    alert('Finish Called');
}
function showStep(obj) {
    // Get current step
    var step_num = obj.attr('rel'); // get the current step number
}

И HTML-разметка (для краткости я удалил содержимое шага в тегах <p> - это привело к тому же отсутствию функциональности, как если бы внутри был контент, так что это можно исключить) 

<div id="wizDialog">

<div id="wizard" class="swMain">
        <ul>
            <li><a href="#step-1">
            <label class="stepNumber">1</label>
            <span class="stepDesc">
               Step 1<br />
               <small>Step 1 - </small>
            </span>
            </a></li>
            <li><a href="#step-2">
            <label class="stepNumber">2</label>
            <span class="stepDesc">
               Step 2<br />
               <small>Step 2 - </small>
            </span>
            </a></li>
            <li><a href="#step-3">
            <label class="stepNumber">3</label>
            <span class="stepDesc">
               Step 3<br />
               <small>Step 3 - </small>
            </span>                   
            </a></li>
            <li><a href="#step-4">
            <label class="stepNumber">4</label>
            <span class="stepDesc">
               Step 4<br />
               <small>Step 4 - </small>
            </span>                   
            </a></li>

            <li><a href="#step-5">
            <label class="stepNumber">5</label>
            <span class="stepDesc">
               Step 5<br />
               <small>Step 5 - </small>
            </span>                   
            </a></li>     
            <li><a href="#step-6">
            <label class="stepNumber">6</label>
            <span class="stepDesc">
               Step 6<br />
               <small>Step 6 - </small>
            </span>                   
            </a></li>
            <li><a href="#step-7">
            <label class="stepNumber">7</label>
            <span class="stepDesc">
               Step 7<br />
               <small>Step 7 - </small>
            </span>                   
            </a></li>
            <li><a href="#step-8">
            <label class="stepNumber">8</label>
            <span class="stepDesc">
               Step 8<br />
               <small>Step 8 - </small>
            </span>                   
            </a></li>                       
        </ul>
        <div id="step-1">   
        <h2 class="StepTitle">Step 1 Content</h2>
            <p>
            </p>                                
        </div>
        <div id="step-2">
        <h2 class="StepTitle">Step 2 Content</h2>   
            <p>
            </p>        
        </div>                      
        <div id="step-3">
        <h2 class="StepTitle">Step 3 Content</h2>   
            <p>
            </p>
        </div>
        <div id="step-4">
        <h2 class="StepTitle">Step 4 Content</h2>   
            <p>
                </p>

        </div>
        <div id="step-5">
        <h2 class="StepTitle">Step 5 Content</h2>   
            <p>
            </p>

        </div>
        <div id="step-6">
        <h2 class="StepTitle">Step 6 Content</h2>   
            <p>
                </p>

        </div>
        <div id="step-7">
        <h2 class="StepTitle">Step 7 Content</h2>   
            <p>

            </p>

        </div>
        <div id="step-8">
        <h2 class="StepTitle">Step 8 Content</h2>   
            <p>
            </p>

        </div>    

</div>
</div>

Кто-нибудь имел подобные результаты с этим?Или есть объяснение, почему мастер не будет работать, если вложен в дополнительные теги <div>?

1 Ответ

1 голос
/ 10 апреля 2012

onLeaveStep требует, чтобы вы возвращали логическое значение. Верните true и вы сможете продвигаться через мастера.

...