intro.js

Question

我遇到了问题，在进入下一个用户游览步骤之前无法使用introjs找到任何解决方案。我确实找到了替代的lib Slideshow，有类似的东西（completedConditions）：

 steps: [
    {
        title: "Choose a name for your project",
        text: "Enter a name for your project.",
        completingConditions: [
            function(){
                return $("#project_name").val().length > 5;
            }
        ]
    },
    //...

但是这个lib无法浏览每页，因此它不符合我的要求。

有什么方法可以在介绍js中使用条件语句或者是否有任何其他类似的js lib？

Answer 1

我自己做了一些事情：

采取类似的步骤：

steps: [
    {
      intro: "Start tour !"
    },
    {
      element: document.querySelector('#addPrice'),
      intro: "test",
      position: 'right',
      condition: function(){
        if($scope.test.length > 0){
          return true;
        }else{
          return false;
        }
      }
    }, ......

我添加条件属性作为函数然后在第755行的intro.js文件中我扩展到检查条件：

 if(typeof(targetElement.condition) == "function"){
      if(targetElement.condition()){
        nextTooltipButton.className += " " + "introjs-disabled";
      }
    }

如果条件为假则结束，然后添加一个类以防止下一个按钮操作。