触发由父视图引起的任何事件时退出游览 - Intro.js
Exit Tour on triggering of any event caused by parent view - Intro.js
File Manager - Home Normal
我使用的大部分内容都基于 AJAX 回调。单击我页面上的 link 按钮 pops-up 模式(按钮有一些 class 和 jquery 事件被触发以加载 modal-pop-up 并显示内容)。我的应用程序中使用的导游是 Intro.js,我根据社区的一些推荐从 http://www.introjs.com 下载了它。
只要执行正常的例程,IntroJs 就可以正常工作。
这是我的代码(只包含相关行):
elementsArrays = getIntroElements(); // Get All the elements that can be in tour list
availableElements = getAvailableElements(elementsArrays) // Input the Array of Elements and Return Available Elements in page
TotalCount = availableElements.ids.length + availableElements.classes.length + 2; // Set the Object for ease-of-access
setUpIntroElements(); // SetsUp the route path for tourguide to move through
introJs().start(); // Starts the Tour Guide
但是当我点击一个link按钮时(当导游正在进行时,那个按钮在那一刻是可以访问的(例如目标高亮元素是主容器,更新按钮是高亮区域的一部分. 所以它是可点击的。)), 相应的模态 window 弹出但游览尚未完成。我按 left/right 箭头键,下一个 data-step introjs 出现在我的模式弹出窗口 window 上。 (Modal popup window)
这是我尝试关闭游览的代码
// Close the wizard on any button click or disabled clicking any button there in the page
$("body").on("click", ".filemgt-file-index a", function(e){
if( $(".introjs-showElement")[0] ) // case: the tour is in process
{
//e.stopPropagation(); // not working
e.stopImmediatePropagation() // not working
//var esc = $.event("keydown", {keyCode:27});
//$("body").trigger(esc); // didnt work at all
// Trigger the below event
// a.introjs-button.introjs-skipbutton
introJs().exit(); // Exit the Tour and Work on new set // doesn't work very well
// need to apply "press Esc event" programmatically in jquery
// Triggering event equavalent to pressing Esc button
// disable all events associated with it
introJs().exitIntro()
}
});
当我 close/cancel 我的模态 window 时,仍然没有终止游览,按 left/right 箭头键显示相应的 data-step 元素介绍。 (File Manager - Home (after Closing Modal popup))
我想要实现的是,如果点击导游中的任何 link,游览应该结束,新模式应该弹出,所有焦点都集中在它上面。
所附图片说明了情况以及我到底想要什么。看看它们,如果我在问题陈述中遗漏了什么,请告诉我。
非常感谢您。
保持幸福。
这不是标准解决方案,但它帮助我随时随地解决问题。
查看浏览器中出现的源代码时 window(检查元素(F12 功能键),我发现 class "introjs-skipbutton" 反对工具提示的跳过按钮流行音乐
我发现单击此按钮会退出导览,因此我将以下代码放入我的 JQUERY 文件中:
// Close the wizard on any button click or disabled clicking any button there in the page
$("body").on("click", ".main_container_div_of_view a", function(e){
if( $(".introjs-showElement")[0] ) // case: the tour is in process
{
$('.introjs-skipbutton').click(); // Terminate Introduction
}
});
这就成功了,退出了游览。但在我看来这仍然不是标准做法。
File Manager - Home Normal
只要执行正常的例程,IntroJs 就可以正常工作。
这是我的代码(只包含相关行):
elementsArrays = getIntroElements(); // Get All the elements that can be in tour list
availableElements = getAvailableElements(elementsArrays) // Input the Array of Elements and Return Available Elements in page
TotalCount = availableElements.ids.length + availableElements.classes.length + 2; // Set the Object for ease-of-access
setUpIntroElements(); // SetsUp the route path for tourguide to move through
introJs().start(); // Starts the Tour Guide
但是当我点击一个link按钮时(当导游正在进行时,那个按钮在那一刻是可以访问的(例如目标高亮元素是主容器,更新按钮是高亮区域的一部分. 所以它是可点击的。)), 相应的模态 window 弹出但游览尚未完成。我按 left/right 箭头键,下一个 data-step introjs 出现在我的模式弹出窗口 window 上。 (Modal popup window)
这是我尝试关闭游览的代码
// Close the wizard on any button click or disabled clicking any button there in the page
$("body").on("click", ".filemgt-file-index a", function(e){
if( $(".introjs-showElement")[0] ) // case: the tour is in process
{
//e.stopPropagation(); // not working
e.stopImmediatePropagation() // not working
//var esc = $.event("keydown", {keyCode:27});
//$("body").trigger(esc); // didnt work at all
// Trigger the below event
// a.introjs-button.introjs-skipbutton
introJs().exit(); // Exit the Tour and Work on new set // doesn't work very well
// need to apply "press Esc event" programmatically in jquery
// Triggering event equavalent to pressing Esc button
// disable all events associated with it
introJs().exitIntro()
}
});
当我 close/cancel 我的模态 window 时,仍然没有终止游览,按 left/right 箭头键显示相应的 data-step 元素介绍。 (File Manager - Home (after Closing Modal popup))
我想要实现的是,如果点击导游中的任何 link,游览应该结束,新模式应该弹出,所有焦点都集中在它上面。
所附图片说明了情况以及我到底想要什么。看看它们,如果我在问题陈述中遗漏了什么,请告诉我。
非常感谢您。 保持幸福。
这不是标准解决方案,但它帮助我随时随地解决问题。
查看浏览器中出现的源代码时 window(检查元素(F12 功能键),我发现 class "introjs-skipbutton" 反对工具提示的跳过按钮流行音乐
我发现单击此按钮会退出导览,因此我将以下代码放入我的 JQUERY 文件中:
// Close the wizard on any button click or disabled clicking any button there in the page
$("body").on("click", ".main_container_div_of_view a", function(e){
if( $(".introjs-showElement")[0] ) // case: the tour is in process
{
$('.introjs-skipbutton').click(); // Terminate Introduction
}
});
这就成功了,退出了游览。但在我看来这仍然不是标准做法。