在 zurb jquery joyride 的特定游览中禁用下一个按钮

Posted 2023-05-09

【中文标题】在 zurb jquery joyride 的特定游览中禁用下一个按钮

【英文标题】：disable next button in a particular tour in zurb jquery joyride

【发布时间】：2014-06-17 22:08:38

【问题描述】：

我正在使用http://zurb.com/playground/jquery-joyride-feature-tour-plugin

创建指导教程。我需要在其中一个教程中排除下一个按钮。我确实在该教程的<li> 标记中添加了data-options="nextButton:false;"，但仍然可以看到下一个按钮。我正在发布所有相关代码。

$('#joyRideTipContent')
            .joyride(
                    
                        autoStart : true,
                        modal : true,
                        nextButton : true,
                        expose : false,
                        nubPosition : 'auto',
                        tipContainer : 'body',
                        tipAnimation : 'fade',

                    );

在li

<li data-id="eleId" data-text="Next: Blah Blah" data-options="nextButton:false;">

【问题讨论】：

应用一个 id 到 li 然后禁用下一个按钮 $('#li_id').joyride( nextButton : false );

它不工作@Rider。他们还有其他办法吗？？

【参考方案1】：

我在显示下一个按钮之前添加了一个表示有人同意的复选框。根据[index]找到当前step的div，然后定位到Next链接改变CSS。

步骤 html：接受

this.preStepCallback = function (index) 
    $('div[data-index="' + index + '" ]').find('a:contains("Next")').css("display":"none");

    $('input:checkbox').live('change', function()
        if($(this).is(':checked'))
            $('div[data-index="' + index + '" ]').find('a:contains("Next")').css("display":"");
         else 
        $('div[data-index="' + index + '" ]').find('a:contains("Next")').css("display":"none");
        
    );