Question

这是我的JS代码，我想使用javascript来制作我的within("#wrapper1") do find("#conflict") # will find the matching element inside the wrapper1 div end下一步，但我不知道应该写什么代码。

wizard

----已添加

我不认为

$("#wizard").steps({
  headerTag: "h3",
  bodyTag: "section",
  transitionEffect: "slideLeft",
  autoFocus: true,
  onStepChanging: function(e, currentIndex, newIndex){
    // use ajax to check if something is correct
    var req = ocpu.call("XXX",{},function(session){
    }).done(function(){
      // THIS IS WHERE I NEED CODE TO LET THE #WIZARD TO FORWARD TO NEXT STEP BECAUSE THE FOLLOWING RETURN TRUE WON'T BE WORKING.
    }) 
    // return true;
  }
});

适用于$("#wizard").steps("next");。例如，

HTML：

onStepChanging

JS：

<div id="wizard">
  <h3>Step-1</h3>
  <section>
  First
  </section>
  <h3>Step-2</h3>
  <section>
  Second
  </section>
</div>

Answer 1

在没有Steps库的情况下编写它似乎更容易，但无论如何，以下应该允许此过程工作。

首先，我使用了相同的HTML，包括jQuery和jQuery Steps插件，然后将JS修改为：

var validatedStepOne = false;

$("#wizard").steps({
  headerTag: "h3",
  bodyTag: "section",  
  transitionEffect: "slideLeft",
  autoFocus: true,
  onStepChanging: function(e, currentIndex, newIndex){
    if(currentIndex == 0 && !validatedStepOne) {
      $.post('ajax.php', {var: 'expected value'}, function(data) {
        if(data != 0) {
          validatedStepOne = true;
          $('#wizard').steps('next');
        }
        else {
          alert('ERROR, unexpected value');
        }
      });
      return false;
    }
    return true;
  }
});

在代码中，您会注意到我有一个全局变量（validatedStepOne）来存储第一条信息是否已通过AJAX验证。最初的问题是onStepChanging要求true返回以进入下一步 - 通过从.steps('next')内部调用onStepChanging，我们只是递归调用onStepChanging }。这样，如果在第一步并等待验证，它将返回false，如果验证完成或在任何其他步骤，它将返回true（如果需要，可以添加else if s使用AJAX来验证更多，并为每个变量提供全局变量。当AJAX响应返回时，如果值是预期值，我们设置全局变量以关闭步骤的AJAX验证，然后我们调用.steps('next')继续下一个。有意义吗？

在这段代码中，您显然需要修改AJAX调用，但它应该是相同的概念 - 只需将全局validatedStepOne变量设置为true并在之后调用.steps('next')。

编辑：为了避免混淆，我使用if(data != 0)，因为我的测试AJAX文件刚刚返回1（假装＆＃39;期望值＆＃39;始终是我想看的值）。 / p>

如何使用javascript转发jQuery-Steps中的步骤

----已添加

1 个答案: