我在我的项目中使用：
http://www.jquery-steps.com/Examples#async.这是一个很好的Jquery插件,用于添加向导.
我的问题是关于动态步骤.下一步的内容应取决于上一步的答案.如何通过AJAX调用向我的后端发送其他数据.我的后端将根据该值为下一步服务.
我搜索了文档和源代码,但找不到答案.
解决方法
目前有两种方法可以实现它.一个用更多,另一个用更少的努力.但是更少的努力意味着更少的控制 – 换句话说,jQuery Steps处理显示和隐藏加载消息和异步调用本身当然.无论如何,第一个解决方案(减少工作量)要求您在初始化时添加默认的异步步骤,就像您习惯的那样.
<div id="wizard">
<h1>Choose</h1>
<div>
<select id="choose">
<option value="0" selected="selected">default</option>
<option value="1">extraordinary</option>
</select>
</div>
<h1>Result 1</h1>
<div data-mode="async" data-url="/rest/service/0"></div>
</div>
然后将一小部分代码添加到onStepChanging事件中,如melc提到的那样.此代码应分析上一步的数据,并在必要时删除默认的异步步骤,并在同一位置添加新的但具有不同的URL.
<script>
$(function()
{
var wizard = $("#wizard").steps({
onStepChanging: function(event,currentIndex,newIndex)
{
if (currentIndex === 0)
{
if ($("#choose > option:selected").val() === "1")
{
wizard.steps("remove",1);
// In this case you Could also use add instead of insert
wizard.steps("insert",1,{
title: "Result 2",contentMode: "async",contentUrl: "/rest/service/1"
});
}
}
return true;
}
});
});
</script>
另一种解决方案已由melc描述.