如何在快速选项卡式面板中禁用选项卡单击

How to disable tab clicks in spry tabbed panel?

本文关键字：选项 单击      更新时间：2023-09-26

到目前为止，我已经编写了在单击按钮之前将选项卡的显示属性设置为none的代码。代码如下所示。

问题是一次只显示一个选项卡。我想要的是，所有选项卡都应该是可见的，但不能点击。如果可能的话，请帮我写代码，或者给我一些建议，我会自己尝试编码，并将其作为答案发布在这里。

谢谢！

在中

<div id="TabbedPanels1" class="TabbedPanels">
    <ul class="TabbedPanelsTabGroup">
      <li class="TabbedPanelsTab" tabindex="-1" id="tab1"><b>BOOKING</b></li>
      <li class="TabbedPanelsTab" tabindex="-1" id="tab2" style="">QUOTE</li>
      <li class="TabbedPanelsTab" tabindex="-1" id="tab3">SIGNUP</li>
      <li class="TabbedPanelsTab" tabindex="-1" id="tab4">PAYMENT</li>
    </ul>

在中（只有第一个选项卡可见，其他选项卡不可见）

<script type="text/javascript">
$(document).ready(function(){
    /*initially hide all tab except tab1*/
    $('.TabbedPanelsTabGroup').children().hide().eq(0).show();
    /*show tab2 when click the complete button by hiding all tabs*/
    $('.complete').on('click', function(){
         $('#tab2').siblings().slideUp();
        $('#tab2').slideDown();
    });
});
</script>

在JS中：（点击按钮）（这样第二个选项卡将可见，其余3个选项卡将不可见）

TabbedPanels1.showPanel(1);
$('.TabbedPanelsTabGroup').children().hide().eq(1).show();

试试这个

$('.TabbedPanelsTabGroup').off("click");

或

$('.TabbedPanelsTabGroup li').off("click");

jQuery关闭（）。

如果不起作用，请告诉我。

更新1

$('.TabbedPanelsTabGroup li').on("click", function(){
   return false;
});

或者，如果您正在使用jquery选项卡，请查看：http://jqueryui.com/demos/tabs/#event-选择

感谢您的帮助，我终于自己找到了答案。其实很简单。我刚刚在.js文件中评论了Spry.Widget.TabbedPanels.prototype.onTabClick事件。

/*Spry.Widget.TabbedPanels.prototype.onTabClick = function(e, tab)
{
    this.showPanel(tab);
return this.cancelEvent(e);
};*/

现在选项卡是不可点击的，并且按照我希望的方式工作。

使用此

 $('.TabbedPanelsTabGroup').children().unbind("click");
 $('.TabbedPanelsTabGroup').children().eq(0).bind("click");

而不是进行

$('.TabbedPanelsTabGroup').children().hide().eq(0).show();
相关文章：