Question

我有一个像这样的手风琴

$(".accordion-form").accordion({
    collapsible:false,
    autoHeight: false,
    changestart: checkChanged,
    change: function(e, ui) {active = $( ".accordion-form" ).accordion( "option", "active");},
    active: 0
});

活动是一个始终具有活动内容的静态变量。

我想要做的是在激活标记之前启用标题，然后禁用活动标题以进行点击。

通过这种方式，我可以使手风琴表现得像“你可以回去但没有前进直到完成这部分”。

任何帮助将不胜感激

Answer 1

虽然我同意Frédéric认为手风琴不是这种行为的好小部件，但你应该能够用一些简单的JS来做到这一点。将另一个'onclick'处理程序附加到手风琴标题上，如果标题太远，则将其删除：

$('.accordion-form .ui-accordion-header').click(function(e) {
    if($(this).index() > current_section.index())
    {
        e.stopImmediatePropagation();
    }
});

那需要你有一个current_section变量来保存最后一个部分（我假设你已经有了这样的东西），并确保在JqueryUI手风琴设置之后（或之前）附加这个处理程序，所以首先调用你的处理程序。

希望这有帮助！

Answer 2

我在其他地方找到了解决这个问题的方法：

// Add the class ui-state-disabled to the headers that you want disabled
$( ".whatyouwantdisabled" ).addClass("ui-state-disabled");

现在实施禁用功能的黑客攻击：

// replace the old eventhandler
var accordion = $( "#accordion" ).data("accordion");
accordion._std_clickHandler = accordion._clickHandler;
accordion._clickHandler = function( event, target ) {
 var clicked = $( event.currentTarget || target );
 if (! clicked.hasClass("ui-state-disabled")) this._std_clickHandler(event, target);

每当您想重新激活标签时，请执行以下操作：

// Remove the class ui-state-disabled to the headers that you want to enable
$( ".whatyouwantenabled" ).removeClass("ui-state-disabled");

来源：https://forum.jquery.com/topic/disable-enable-sections-of-accordion

jquery ui accordion禁用点击

2 个答案: