Bootstrap Tour - 在一頁中初始化兩個遊覽

Question

我在這裏發佈是因爲我無法在Boostrap Tour的官方文檔或任何其他主題中找到我的問題的解決方案。

這裏是我的問題： 我有一個頁面中，我想爲了給選擇我的用戶選擇哪一個啓動初始化二次遊覽。它們由「onClick」調用的函數「StartTour」啓動。

如果我在同一頁面聲明並初始化我的兩個巡視路線，那麼當我運行第一個巡視路線時，在第三步中，它會切換到第二個巡視路線的第二步。當我運行它時，第二個遊覽完美地工作。

我實際的代碼看起來像這樣（我將只包括相關部分）：

var tour1 
var tour2 
[...] 
// Bootstrap tour 

     //Create tour1 
      tour1 = new Tour({ 
      storage: window.localStorage, 
      debug: true, 
      //add steps 
      steps: [ 
       { 
       path:"/base/show/1", 
       element: "#home", 
       title: "{{ 'tuto11 title' | trans }}", 
       content: "{{ 'tuto11 desc' | trans }}", 
       placement: "right" 
      }, 
      { 
       path:"/base/show/1", 
       element: ".mce-item-table", 
       placement: "top", 
       title: "{{ 'tuto12 title' | trans }}", 
       content: "{{ 'tuto12 desc' | trans }}" 
      }, 
      { 
       path:"/base/show/2124", 
       element: ".titlepage", 
       title: "{{ 'tuto13 title' | trans }}", 
       content: "{{ 'tuto13 desc' | trans }}", 
       placement: "top" 
      }, 
      { 
       path: "/base/show/2566", 
       element: ".titlepage", 
       title: "{{ 'tuto14 title' | trans }}", 
       content: "{{ 'tuto14 desc' | trans }}", 
       placement: "top" 
      }, 
      { 
       path: "/base/show/1093", 
       element: ".titlepage", 
       title: "{{ 'tuto15 title' | trans }}", 
       content: "{{ 'tuto15 desc' | trans }}", 
       placement: "top" 
      }, 
      { 
       path: "/base/show/1093", 
       element: "h2", //h2 = pas bon 
       title:"{{ 'tuto16 title' | trans }}", 
       content:"{{ 'tuto16 desc' | trans }}", 
       placement:"top" 
      } 
      ] 
     }); 

     //Initialize the tour 
     //tour1.init(); 

     //Create tour2 
     {% if app.user %} 
     tour2=new Tour({ 
      storage: window.sessionStorage, 
      debug: true, 
      //add steps 
      steps: [ 
       { 
       path: "/base/show/1", 
       element: "#icProfil", 
       title:"{{ 'tuto21 title' | trans }}", 
       content:"{{ 'tuto21 desc' | trans }}", 
       placement:"bottom" 
      }, 
      { 
       path: "/member/show/{{ app.user.getId()}}", 
       element: ".titlepage", 
       title:"{{ 'tuto22 title' | trans }}", 
       content:"{{ 'tuto22 desc' | trans }}", 
       placement: "top" 
      }, 
      { 
       path: "/member/show/{{ app.user.getId() }}", 
       element: ".fa-icon-pencil", 
       placement: "bottom", 
       title:"{{ 'tuto23 title' | trans }}", 
       content:"{{ 'tuto23 desc' | trans }}" 

      }, 
      { 
       path: "/member/edit/{{ app.user.getId() }}#civil", 
       element: "#idn1", 
       placement: "left", 
       title: "{{ 'tuto24 title' | trans }}", 
       content: "{{ 'tuto24 desc' | trans }}" 
      }, 
      { 
       path: "/member/edit/{{ app.user.getId() }}#social", 
       element: "#idn2", 
       placement: "left", 
       title: "test", 
       content: "test" 
      } 
      ] 
     }); 

     tour2.init(); 
     {% endif %} 

    }) 

    //Start the tours 
    function startTour1(){ 
     tour1.restart(); 
    } 

    function startTour2(){ 
     tour2.restart(); 
    } 

我已經測試： 如果我不初始化遊2，游完全時1件作品StartTour1（）被調用。 我也試圖實現我的啓動功能這樣的：

function startTour2(){ 
      tour2.init(); 
      tour2.restart(); 
    } 

在這種情況下，tour1的偉大工程，但tour2啓動時，其上運行的第一步，但到達的第2步的時候，我有此錯誤消息：

Bootstrap Tour'tour'|重定向到/ member/show/2072

Bootstrap Tour'tour'|重定向到/ base/show/1

Bootstrap Tour'tour'|錯誤重定向循環到/ base/show/1

我還沒有在Internet上的任何頁面或任何規範中找到任何多初始化的例子。關於這個文件。 如果您有任何線索，請提前致謝。

Answer 1

我發現我的錯誤：遊覽有一個變量「名稱」。默認情況下，它被定義爲'tour'，如果它沒有被覆蓋，所有的遊覽都有相同的名字。如果每個遊覽都有自己的名字，我的代碼完美地工作。